JQuery 未捕获下拉值

Question

我正在制作一个 API 接口来安排包裹取件。 API 需要包的数量等。我的项目经理说他需要将包的数量作为一个下拉列表。现在尝试从表单中获取包裹数量是行不通的，尽管它适用于我的其他下拉菜单。

我的用于生成下拉列表的 PHP 代码：

<select name="package_count" id="package_count" class="form-control form-inps">
                                <?php for ($i=1; $i<26; $i++) {
                                    if ($i !== 1) {
                                        echo "<option value='${i}'>${i}</option>";
                                    } else {
                                        echo "<option selected='selected' value='${i}'>${i}</option>";
                                    }
                                } ?>
                            </select>

捕获 API 调用的代码：

info.package_count = $("#package_count").val();

作为参考，这是我用于生成客户状态下拉列表的代码：

<select id="state" name="state" class="form-control form-inps">
                            <?php $customerState = $customer_id->state;
                                foreach ($categories as $abbr=>$full) {
                                if ($abbr !== $customerState && strtolower($full) !== strtolower($customerState)) {
                                    echo "<option value='${abbr}'>${full}</option>";
                                } else {
                                    echo "<option value='${abbr}' selected='selected'>${full}</option>";
                                }
                            }?>
                        </select>

以及捕获它的代码：

info.state = $("#state").val();

尽管结构看起来相同，但国家会被抓住，但包裹数量却不会：

city: 
"REDACTED"
company: 
""
date: 
"2023-03-17"
earliest: 
"13:00"
latest: 
"17:00"
name: 
"REDACTED"
package_count: 
""
shipping_direction: 
undefined
shipping_provider: 
undefined
state: 
"REDACTED"
street: 
"REDACTED"
street2: 
""
zip: 
"REDACTED"

有什么想法为什么 state 有效但 packagecount 不起作用？

Answer 1

您尝试使用多个选项循环选择了错误的方法

|| echo "${i}";

它也是最终值作为选定的默认最后值

试试这个

$("#package_count").change(function(){
 var val= $("#package_count option:selected").val();
  $('#result').html(val);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="package_count" id="package_count" class="form-control form-inps">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
<option value="8" >8</option>
<option value="9" >9</option>
<option value="10" >10</option>

  </select>
  
  <p id="result" style="color:red;font-size:14px"></p>