使用 javascript 重置选定的选择框

Resetting a chosen select box with javascript

本文关键字:选择 javascript 使用      更新时间:2023-09-26

我在对使用所选插件的选择框执行操作时遇到问题。 使用所选选择框的输入来操作标准 HTML 选择框时似乎很好,但是当我将"chzn-select"类添加到该选择框中时,脚本会失败。

这是代码。

.HTML:

<form>
    <select id="sel1" name="sel1" class="chzn-select">
        <option value="1">1</option>
        <option value="2">Computer</option>
        <option value="3">3</option>
    </select>
    <div id="select2" style="display:none">
        <select id="sel2" name="sel2" selected="selected" class="chzn-select">Select
           <option value=""></option>
           <option value="1">1</option>
           <option value="2">2</option>
           <option value="3">3</option>
         </select>
    </div>
</form>

javascript:

$(function () {
    var selCategory = $('#sel1');
    selCategory.change(function () {
        selCategory.find('option:selected').each(function () {
            if ($(this).text() ==='Computer') {
                $('#select2').show();
            }
        else{
            $('#select2').hide();
        }
        });
    });
});
$('#sel1').on('change', function () {
     $('#sel2').prop('selectedIndex',0);
});

任何关于我出错的地方的指示将不胜感激!

编辑 11/

11/13

我有一些时间来解决这个问题,因为我收到的关于这个问题的所有答案对于常规选择框似乎是正确的,但对于所选插件则不正确。这需要单独更新。修复方法是添加$('#sel2').val('').trigger('chosen:updated');,将所选选择框重置为其原始状态。我在这里找到了代码 如何使用 jQuery 重置 jquery 选择的选项?

感谢您给我的所有帮助,并希望此编辑可以帮助任何像我一样困惑的人。

您需要更改选项上的属性"selected",而不是 select 标记上的属性。

属性selected应该在option标记内