Question

如何使用jquery以编程方式打开下面的选择菜单

<select id="selectMenu">        
 <option value="" class="first">c</option>       
 <option value="" class="">c++</option>       
 <option value="" class="">java</option> 
</select>

我尝试过代码

<script>
 $(document).on("pageinit", "#Test", function(e){
 $('.testSelect').on('tap',function() {
// $('#selectMenu').click();
 $('#selectMenu').selectmenu();
// $('#selectMenu').selectmenu('refresh');
 $('#selectMenu').selectmenu( "open" );
 $('#selectMenu').trigger("click");
 });
 });
</script>

但是对我来说没有任何帮助，它为选择选项的非原生菜单工作（即当我使用data-native-menu =“false”但不适用于我正在寻找的东西。）

真正的问题是我想使用图像作为选择菜单按钮，它将在桌面浏览器和移动设备上显示选择标记的原生菜单

所以我想点击图片我会打开选择菜单（原生菜单），我隐藏了选择菜单标签。

任何帮助将不胜感激。

Answer 1

要在jquery中使用图像作为选择菜单按钮，需要覆盖jquery在创建选择菜单时添加的jquery类。

无需更改jquery .css文件，只需使用标记的样式属性覆盖它们（properties / attribite）。

使用以下代码执行此操作对我有用 - ＆gt;

<div class="ui-select">
    <div data-icon="none" data-theme="a" class="ui-btn" style="margin: 0px; text-align: inherit;">
            <img class="img-responsive" alt="" src="../../images/image.png" style="">           
        <select id="selectMenuCls" data-native-menu="true" size="0" data-role="none">         
            <option value="" class="first">c</option>       
            <option value="" class="">c++</option>       
            <option value="" class="">java</option> 
        </select>
    </div>
</div>

请注意，在select标签中，data-role =“none”属性是必不可少的，因此jquery不会将其自定义类应用于选择菜单

如何在jquery mobile的选择菜单上触发/打开本机菜单？

1 个答案: