Question

我使用以下jquery代码来限制多选框中的选择。它在任何Android设备上都能正常工作，但在iphone中会出现问题。

在iphone中显示警告消息，但未按预期取消选择最后选择的元素。它应显示所选的3个项目，但它显示在iphone中发生警报消息后选择的4个项目。任何暗示赞赏。在此先感谢。

<select id="mob-industry">
  <option value="1">Web Development</option>
  <option value="2">Architecture</option>
  <option value="3">Software Development</option>
  <option value="4">Hardware</option>
</select>


var last_valid_selection = null;
$('#mob-industry').change(function(event) {
    if ($(this).val().length > 3) {
        sweetAlert("","Only 3 Allowed","info");
          $(this).val(last_valid_selection);
    } else {
          last_valid_selection = $(this).val();
    }
 });

Answer 1

我猜你的方法来自：How do you limit options selected in a html select box?

但我认为这是你真正想要/应该使用的：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

<select id="mob-industry" multiple>
    <option value="1">Web Development</option>
    <option value="2">Architecture</option>
    <option value="3">Software Development</option>
    <option value="4">Hardware</option>
</select>

$('#mob-industry').bind("vmousedown", function(event) {
    var num_selected = $(this).find(":selected").length;
    if (num_selected == 3) {
        var last_selected_value = $(event.target).val();
        var select_array = $(this).val();
        if ($.inArray(last_selected_value, select_array) == -1) {
            alert("YOU SHALL NOT PASS!!!");
            event.preventDefault();
            return false;
        }
    }
});

小提琴（使用mousedown（）而不是.bind（“vmousedown”）与计算机兼容）：https://jsfiddle.net/kpm0yLyt/1/

JsDoIt（移动模拟，虽然有一些奇怪的错误，当你选择它们时显示选项。忽略它。）：http://jsdo.it/Macainian/GKxn

哦顺便说一句，替代方法（使用click（）而不是.bind（“vclick”）与计算机兼容）：https://jsfiddle.net/m49wr4t1/5/

从iphone中的多选框中取消选择最后一个选项

1 个答案: