5

我想在 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 个选项（滚动后的其他选项）：

截图 3

我该怎么做？

编辑 1 ：同时我在这里发现了一个类似的问题，但似乎也没有解决方案...

编辑 2：我现在找到了jQuery Mobile和listview的解决方法，请参阅下面的答案，但是我还在等待其他（更好的）想法...

4

2 回答 2

0

我现在找到了一种使用jQuery Mobile和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>

解决方法的屏幕截图：
截屏

于 2012-10-24T22:43:15.910 回答
-1

而不是使用 div。我认为您应该使用表格。

于 2012-10-24T01:57:06.703 回答