使用 $('#id').val() 不会返回下拉列表的选定值

Using $('#id').val() doesn't return the selected value of a dropdown

本文关键字:下拉列表 返回 val #id 使用      更新时间:2023-09-26

我正在尝试查找下拉列表的选定值,但一直得到空字符串或未定义的结果。

我的 HTML 看起来像这样:

<div class="input-group" style="padding-bottom: 10px;">
    <span id="add-addon-styling" class="input-group-addon">Status</span>
    <!-- TODO: Make this automatically rather than hardcoded -->
    <select class="form-control required" id="new-activity-modal-status-dropdown">
        <option value="NA" class="selected">N/A</option>
        <option value="ON_TRACK">On Track</option>
        <option value="ISSUE">Issue</option>
        <option value="BEHIND">Behind</option>
    </select>
    <span class="input-group-addon" data-toggle="tooltip" data-placement="top" title="The Status of the Activity. Usually On Track but otherwise set to N/A if unsure.">
        <b>?</b>
    </span>
</div>

下面是 JavaScript:

function OnModalCreateNewActivityBtnClick() {
    var jsonObject = '';
    var modal = $('new-activity-modal-body');
    var activityStatus = modal.find('#new-activity-modal-status-dropdown').val();
    ...
    ...
}

我也看到过这个建议:

function OnModalCreateNewActivityBtnClick() {
    var jsonObject = '';
    var modal = $('new-activity-modal-body');
    var activityStatus = modal.find('#new-activity-modal-status-dropdown').find(":selected").text();
    ...
    ...
}

第一个返回未定义的结果。第二个返回一个空字符串。

我不知道该怎么做。JavaScript 仍然让我感到困惑。

var modal = $('new-activity-modal-body');

应该是

var modal = $('#new-activity-modal-body');

你不会得到任何错误,因为jquery选择器什么也找不到是一个有效的位置。

假设 HTML 是 :

<div class="new-activity-modal-body">...</div>

以下代码将不起作用,因为您没有指定new-activity-modal-bodyclass还是id

var modal = $('new-activity-modal-body');

应该是 :

var modal = $('#new-activity-modal-body'); //id selector
//OR
var modal = $('.new-activity-modal-body'); //class selector

希望这有帮助。

使用

var modal = $('#new-activity-modal-body');

您的变量modal未正确分配。没有new-activity-modal-body.您应该使用 #new-activity-modal-body .

只需更换

var modal = $('new-activity-modal-body');

var modal = $('#new-activity-modal-body');