我正在为Android和iOS开发Phonegap应用程序。大多数东西工作得很好,但我遇到了问题 <select>
标签。它通过jQuery mobile得到增强,在该版本的Android上,当点击/点击相应的div时,选项不会显示。当我点击两次/点击时,它们会显示出来:
- 在包含的div上
<select>
- 在div上方的区域
在该场景中,选项显示,并且当选择更改事件时,将执行更改事件并执行代码绑定。
我发现了这两个android问题:
http://code.google.com/p/android/issues/detail?id=10280 和
http://code.google.com/p/android/issues/detail?id=6721
我尝试过那里提到的解决方法,但他们没有改变任何东西。我仍然需要点击两次,但这不是我追求的行为。我只需要点击一下。
问题仅存在于Android 2.3.3上,我认为也是旧版本。在iOS和更新的Androids上,一切都运行得很好。
我整天都在努力解决这个问题并尝试了一切。
任何帮助,提示将非常感谢。
谢谢。
您是否尝试将data-native-menu =“false”属性添加到选择菜单。
例:
<select name="gender" id="gender" data-theme="b" data-native-menu="false" >
<option value="">Please specify ...</option>
<option value="option1">Male</option>
<option value="option2">Female</option>
<option value="option3">Undisclosed</option>
</select>
这就解决了我的问题。在android 2.3.x我已经设置好了 z-index
在选择框上 ~1000
(远远高于其他元素)它解决了这个问题。显然,原生浏览器搞乱了“层”。希望能帮助到你。
与android 2.3和JavaScript生成的选择框有相同的问题,我的解决方案是使用jQuery在渲染后重新聚焦元素,每次再次渲染时(即使使用$ .SELECT.show())。
在执行$(“#element”)。focus()后,选择框再次正常运行,选择新选项后,它既可以单击又可以更新。
我有同样的问题,我意识到问题是因为我已经使用data-position =“fixed”属性作为包含select元素的页面的标题。当我从我的标题中删除data-position =“fixed”时,标题肯定没有修复,但摆脱了选择不被“点击”这个烦人的问题。希望这可以帮助!
它对我有用的唯一方法是在我的jQuery脚本上添加它:
$('select').click(function () {
$(this).focus();
});
我已经尝试了所有的建议而没有运气。
我最终得到的并不是最好的解决方案,但它比替代方案更好,如果没有别的东西会更新选择框。
我用这样的jQuery做到了:
$(".select_box").change(function() {
$(this).hide();
$(".select_box").show();
});
屁股,更新。
请记住,这只是一个解决方案,如果没有别的办法。
确保你的 div
页面不在另一个页面内 div
。它应该看起来像:
<body>
<div data-role="page">
...
</div>
</body>
不喜欢这样:
<body>
<div>
...
<div data-role="page">
...
</div>
...
</div>
</body>
我使用一个完全相同的问题 select
同 data-native-menu="true"
一旦我删除了额外的东西,一切都很好 div
。
我知道这个问题是两年前发布的,但是为了防止今天有人像我最近那样面对这个问题:
我的行为和你告诉的一样。
我遇到的问题是一个div作为标题显示,并具有属性data-role =“header”和data-position =“fixed”。 jquery mobile中存在一个错误,导致Android 2.2 / 2.3中出现一些奇怪的问题(http://demos.jquerymobile.com/1.3.2/widgets/fixed-toolbars/)。
我修复了从标题中删除'data-position =“fixed”'并使用以下代码添加自定义类的错误:
.custom-header{
position: fixed !important;
left: 0px !important;
right: 0px !important;
top: 0px !important;
z-index: 999 !important;
}
希望它对某人有帮助。