13

先週の金曜日にこの問題に関する同様の質問を見つけましたが、再び見つけられないようです。誰かが私を正しい方向に向けることができれば、それは素晴らしいことです.

基本的に、ページに複数の選択メニューがあります。1 つ目はロード時に移入され、2 つ目は 1 つ目の選択を決定する際に移入されます。十分に単純です。

ただし、iOS デバイスでは、select 要素をタップすると、選択を行うための iOS スクローラーが起動します。誰かがネイティブの iOSpreviousまたはnextボタンを使用している場合、次の<select>入力は以前の選択データを収集しません。入力された結果が正確であるためには、物理​​的にタップしてからdone次の選択メニューを起動する必要があります。

http://m.lemonfree.comという Web サイトがdoneあり、prev/next. 基本的に、ユーザーに選択を強制しますdone。

彼らがどのようにしてこの機能を実現したのか、非常に興味があります。

乾杯！

念のため、私のコードは次のとおりです。

<form method="post" action="list.php" class="striped-bg-inverted">
  <p>
    <label for="make">Make</label>
    <select name="make" id="make" required="required">
        <option selected>Select a Make</option>
      <?php foreach ($usedMakes->MakeResult as $MakeResult) { ?>
        <option value="<?php echo $MakeResult->makeId; ?>"><?php echo $MakeResult->makeName; ?></option>
      <?php } ?>
    </select>
  </p>
  <p>
    <label for="model">Model</label>
    <select name="model" id="model" required="required">
      <option value="" selected>Select a Model</option>
    </select>
  </p>
  <p>
    <button name="submit" id="submit">&nbsp;Submit&nbsp;</button>
  </p>
</form>

私のJavaScript：

$("#make").change(function() {
  var makeId = $(this).val();
  $.ajax({
    url: "process.inc.php?makeId=" + makeId,
    type: "GET",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (data) {
      var list = "";
      for (i = 0 ; i < data.length; i++) {
        var modelId = data[i].ModelResult.modelId;
        var modelName = data[i].ModelResult.modelName;
        list += "<option value=\"" + modelId + "\">" + modelName + "</option>";
      };
      var theSelect = $("#model");
      theSelect.find("option:gt(0)").remove();
      theSelect.append(list);
    }
  });
});
4

2 に答える 2

2

この特定の問題を解決するモジュールを作成しました。これが GitHub リポジトリです。以下は実際の動作の gif です。

ここに画像の説明を入力

于 2014-01-06T04:50:33.263 に答える