Question

（使用jquery Mobile）我有一个重置按钮，需要重置所有下拉框selectedIndex等于0.我相信索引回零，但选择框上显示的值不正确。它保持相同的价值。

例如：选择“unit2”，然后单击“重置”。单击确定。选择框上显示的值是'unit2'，而它应该是'--Units - '

HTML

<div data-role="fieldcontain" class='seltype' id='xmep' >
  <select id="dmep" data-mini='true'>
    <option value="0">--Units--</option>
    <option value='1'>unit1</option>
    <option value='0.01'>unit2</option>
    <option value='10'>unit3</option>
  </select>
</div>

JQUERY

$(document).ready(function() {
  $('#rstBtn').click(function() {
     var answer = confirm('Click OK to set the selectIndex equal to 0');

        if (answer == false) {
            return;
        } else {
            $('select').prop('selectedIndex', 0);
        }
  });

});

Answer 1

您需要使用.selectmenu('refresh',true)刷新选择菜单。

Demo

$(document).ready(function() {
  $('#rstBtn').on('click', function() {
     if (confirm('Click OK to set the selectIndex equal to 0')) {
         $('#dmep').val(0).selectmenu('refresh',true);

     }
  });
});

这会更准确

  $('#dmep').find('option[value="0"]')
  .prop('selected', true).addBack()
   .selectmenu('refresh', true);

或

   $('#dmep').prop('selectedIndex', 0)
   .selectmenu('refresh', true);

Answer 2

以这种方式运作：http://jsfiddle.net/bWdGB/

使用此方法重置选择框：

$('select').val('0').attr('selected', true).siblings('option').removeAttr('selected');
$('select').selectmenu("refresh", true);

jQuery更改SELECT无法正常工作

2 个答案:

Demo