如何以编程方式更改控件自身更改事件中的选择框选择,并使其在移动浏览器中工作

Mik*_*ger 3 html jquery jquery-mobile

请考虑以下简化的HTML和jQuery代码:

<select id="select1">
  <option value="10">10</option>
  <option value="5">5</option>
  <option selected="selected" value="1">1</option>
</select>

$('#select1').change(function () {
 if ($('#select1').val() > 5) {
   $('#select1').val(1);
   alert("Select set to 1");
 }
});
Run Code Online (Sandbox Code Playgroud)

小提琴

如果用户从选择控件中选择10,则从控件自身的更改事件中将其重置为1.这适用于我桌面计算机上的浏览器,但不适用于iPhone或iPad上的Chrome或Safari.(实际上在移动浏览器上,选择设置为1,然后再设置为10)

基本上,我试图限制用户在某些条件下可以选择的内容.

有没有办法从它自己的更改事件中重置选择控件上的选项,并让它在移动浏览器中工作?

Oma*_*mar 5

您需要选择option或者通过[value=1]或者给它一个类.default的实例.

$('#select_id').val(1);
Run Code Online (Sandbox Code Playgroud)

然后刷新.selectmenu('refresh')以进行重新增强.

$('#select_id').selectmenu('refresh');
Run Code Online (Sandbox Code Playgroud)

演示1 - 演示2