jquery - jQuery Mobile 显示隐藏的选择元素

Question

用 .查看这个select元素display:none。在 jQuery Mobile 中，尽管如此，它仍会显示：

<select id="dddd" name="dddd"
        data-mini="true" data-native-menu="false" data-theme="c"
        onChange=""
        style="display:none">     
  <option value="1">An optinos</option>
</select>

我正在尝试显示/隐藏select依赖于其他用户操作的 jQuery Mobile 元素，因此我为什么要执行上述操作。

有任何想法吗？

Answer 1

当您的页面加载时，jQuery Mobile 会增强您的页面以使其具有移动外观。不幸的是，jQuery mobile 目前存在一个问题，它无法将自定义类（甚至自定义样式，通过 style 属性）附加到增强元素。请检查https://github.com/jquery/jquery-mobile/issues/3577的问题。作为此问题仍未解决的解决方法，您实际上可以将其包装在 div 元素中，并改为控制 div 包装器的显示。

<div id="dddd-wrapper" class="ui-screen-hidden">
  <select data-mini="true" data-native-menu="false" id="dddd" name="dddd" data-theme="c"     onChange="" style="display:none">     
    <option value="1">An optinos</option>
  </select>
</div>

ui-screen-hidden是用于隐藏元素的 jquery mobile 定义的样式规则（在 jquery.mobile..css 中）。