Question

我试图在jQuery Mobile中忽略所有刷新调用（因为它们在我设置data-role =“none”时会产生错误）而不删除实际的调用。

<div data-role="none">
    <label for="select-choice-1" class="select">Choose shipping method:</label>
    <select name="select-choice-1" id="select-choice-1" data-role="none">
        <option value="standard">Standard: 7 day</option>
        <option value="rush">Rush: 3 days</option>
        <option value="express">Express: next day</option>
        <option value="overnight">Overnight</option>
    </select>
</div>

以下调用在javascript中生成错误（因为data-role =“none”）。

$('#select-choice-1').selectmenu('refresh');

我收到的错误是：

Uncaught Error: cannot call methods on selectmenu prior to initialization; attempted to call method 'refresh'

如果我删除data-role =“none”，则此错误不存在。

有没有办法忽略/覆盖刷新调用？我曾尝试使用jQuery .unbind和.off但没有成功，例如：

$(document).on("pageinit", "#mypage", function( event ) {
    $('#select-choice-1').unbind('refresh');
});

我不想删除Javascript中的刷新调用，除非我必须这样做，因为我希望以后能够轻松地重新应用jQuery Mobile样式。有没有人有解决这个问题的方法？

Answer 1

尝试：

if($('#select-choice-1').selectmenu()){
      $('#select-choice-1').selectmenu('refresh');
}

或

if($('#select-choice-1').data("role")!="none"){ 
         $('#select-choice-1').selectmenu('refresh');
}

您不能调用不存在的对象的方法。

Answer 2

如果要禁用.selectmenu()窗口小部件，则需要在mobileinit上全局修改此窗口小部件。此外，无需添加data-role="none"。

这样，select标记将不会使用jQM进行增强/样式化，并且不会受到影响（原生外观）。

如果您这样做，则不应使用.selectmenu("refresh")，因为窗口小部件已被禁用。

告诉jQM不要设置样式select标签，将全局修改绑定到mobileinit，在jQuery之后和jQuery Mobile JS库之前添加它们。

jQuery Mobile 1.3.2及以下

<script src="jquery-1.9.1.min.js"></script>
<script>
  $(document).on("mobileinit", function() {
    $.mobile.page.prototype.options.keepNative = "select";
  });
</script>
<script src="jquery.mobile-1.3.2.min.js"></script>

<强> Demo

jQuery Mobile 1.4

<script src="jquery-1.10.2.min.js"></script>
<script>
  $(document).on("mobileinit", function() {
    $.mobile.keepNative = "select";
  });
</script>
<script src="jquery.mobile-1.4.0-rc.1.min.js"></script>

<强> Demo

使用data-role = none时，jQuery Mobile解除绑定，删除或忽略刷新调用

2 个答案: