我希望在 Android 设备的浏览器上自动打开组合框。
我有以下代码:
<!doctype html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<script src="jquery-1.8.0.min.js" type="text/javascript"></script>
<title>Combobox</title>
</head>
<body>
<div id="combobox">
<select id="select">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
</div>
<script>
$(document).ready(function() {
document.getElementById('select').size=3;
});
</script>
</body>
</html>
这适用于桌面浏览器(见屏幕截图 1),但不幸的是不适用于 Android 设备上的浏览器(见屏幕截图 2),只有在触摸组合框后,当前选项才会出现:
我希望它们在打开页面后立即出现(参见屏幕截图 3)
如果可能,只显示 3 个选项(滚动后的其他选项):
我该怎么做?
编辑 1:同时我发现了一个类似的问题 here , 但似乎也没有解决方案......
编辑 2:我现在找到了使用 jQuery Mobile 和 listview 的解决方法,请参阅下面的答案,但是我我还在等待其他(更好的)想法...
最佳答案
我现在找到了一个解决方法,它使用 jQuery Mobile 和 listview。
ListView 在打开页面后立即出现,这对我来说是可以的。然而,一个完美的解决方案是只显示 3 个选项(滚动后的其他选项)。仍在等待其他想法...
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="jquery-1.8.0.min.js"></script>
<script src="jquery.mobile-1.2.0.min.js"></script>
<title>Combobox Workaround</title>
</head>
<body>
<div data-role="page">
<ul id="listview" data-role="listview">
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>
</div>
<script>
$('#listview').on('click', ' > li', function () {
// show selected index in alert box
alert('index=' + $(this).index());
});
</script>
</body>
</html>
解决方法的屏幕截图:
关于javascript - 在 Android 设备的移动浏览器上自动打开组合框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13011760/