Question

我在查看所有选项（1,2,3）时隐藏了选项列表中的默认选项（当第一次单击选择时），但是在进行选择然后再次查看选项后，它需要以某种方式重新出现。。（仅通过页面刷新，用户可以将选择框视为包含'浴室'的类别，否则无意义的数字1,2,3出现..）

即。目前，“浴室”在选项出现后不再出现，然后再次点击选择框..（如果用户改变主意），这就是问题所在。什么是最好的方法。

我无法更改html - 只需要使用Jquery即可完成。请帮忙

<select name="searchForm__bathrooms" id="field-searchForm__bathrooms" class="field-    dropdown">
    <option value=""> Bathrooms </option>
    <option value="1"> 1 </option>
    <option value="3"> 3 </option>
    <option value="2"> 2 </option>
</select>

$('select option:first-child').hide();

Answer 1

http://jsfiddle.net/earlonrails/EfMvd/2/

的Javascript

$(function() {
    $("#field-searchForm__bathrooms").change(function() {
        var selectEle = $(this);
        var doAppend = true;  
        $.each(selectEle.children(), function(index, child) {
            if (child.value == "0") {
                doAppend = false;
            }
        });
        if (doAppend) {
            selectEle.append('<option name="bathroom" value="0">Bathrooms</option>');
        }
    });
});

HTML

<body>
    <select name="searchForm__bathrooms" id="field-searchForm__bathrooms" class="field-dropdown">
        <option value="1"> 1 </option>
        <option value="2"> 2 </option>
        <option value="3"> 3 </option>
    </select>
</body>

Answer 2

$("#field-searchForm__bathrooms").click(function(){
  $('select option:first-child').toggle();
})

jquery选择选项默认值隐藏并重新出现

2 个答案: