Ich hatte letzten Freitag eine ähnliche Frage zu diesem Problem gefunden, kann sie aber nicht wiederfinden. Wenn mich jemand in die richtige Richtung lenken könnte, wäre das großartig.

Grundsätzlich habe ich mehrere Auswahlmenüs auf einer Seite. Das erste füllt sich beim Laden, das zweite bestimmt die Auswahl des ersten. Einfach genug.

Wenn Sie jedoch auf iOS-Geräten auf das Auswahlelement tippen, wird der iOS-Scroller gestartet, damit Sie eine Auswahl treffen können. Wenn jemand das native iOS verwendetprevious odernext Tasten, die folgenden<select> Bei der Eingabe werden die vorherigen Auswahldaten nicht erfasst. Sie müssen physisch tippendone Rufen Sie dann das nächste Auswahlmenü auf, damit die aufgefüllten Ergebnisse korrekt sind.

Es gibt eine Website namenshttp://m.lemonfree.com was dich zwingt zu tippendone eher, alsprev/next, und verhindert außerdem, dass Sie das iOS-Auswahlmenü antippen, um die Auswahlaufforderung zu schließen. Erzwingt im Wesentlichen die Auswahl des Benutzersdone.

Ich wäre sehr daran interessiert herauszufinden, wie sie diese Funktionalität erreicht haben.

Prost!

Hier ist mein Code für alle Fälle:

<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>

Mein 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);
    }
  });
});