选择下拉菜单中没有发生更改事件

时间:2015-09-07 14:12:49

标签: javascript jquery

在选择停留我们的时候,我正在使用jquery弹出客户数下拉菜单。

<form class="form-inline"  method="get" action="#" th:action="#"  id="search">
    <div class="input-group input-group-sm" style="margin:auto;" id="searchlocation">
        <select class="selectpicker form-control" style="margin-left:-1px;" id="stay">
            <option value="0" selected="selected">Stay Hours</option>
            <option value="1">X</option>
            <option value="2">Y</option>
        </select>
        <select class="selectpicker" style="margin-left:-2px;" id="guest">
            <option value="0" selected="selected">No. of guests</option>
            <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>
        </select>
        <button type="text" class="form-control btn btn-success" style="margin-left:-1px;">Search</button>
    </div>
</form>

Jquery:

$('#stay').change(function () {

    $('#guest').show(function () {
        $( "#guest" ).focus();
        $( "#guest" ).click();
        $( "#guest" ).select();
    });

});

但它不适合我。有人可以帮忙解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

您应该将guests的道具更改为所需的索引: Plunker

$(function() {
  $('#stay').change(function() {
    $('#guest').show(function() {
      $("#guest").focus().prop('selectedIndex', $('#stay').val());
    });
  });
});