使用javascript重置选定的选择框

时间:2013-11-07 17:17:15

标签: javascript jquery jquery-chosen

我在使用所选插件的选择框上执行操作时遇到问题。当使用所选选择框的输入来操作标准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');,将所选的选择框重置为其原始状态。我在这里找到了代码How do I reset a jquery-chosen select option with jQuery?

我感谢你给我的所有帮助,并希望这个编辑可以帮助那些和我一样困惑的人。

2 个答案:

答案 0 :(得分:2)

您需要更改选项上的“已选择”属性,而不是选择标记。

答案 1 :(得分:1)

属性selected应位于option标记