Отменить выбор последней опции из поля multiselect в iphone

Question

Я использую следующий код jquery, чтобы ограничить выделение в окне выбора. Он отлично работает в любом устройстве Android, но проблема возникает в iphone.

В iphone отображается предупреждающее сообщение, но последний выбранный элемент не отменяется, как ожидалось. Он должен отображать выбранные 3 элемента, но он отображает 4 элемента, выбранных после сообщения оповещения в iphone. Любой намек оценили. Заранее спасибо.

<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

О кстати, альтернативный способ сделать это (использует щелчок() вместо .bind («vclick») для совместимости с компьютером): https://jsfiddle.net/m49wr4t1/5/