Question

我正在开发一个项目，要求我使用所有最新版本的jquery。

问题在我的表格中，我正在验证select2多选择输入，并且此验证适用于jquery 2.2.4。但是以某种方式在jQuery 3.3.1中无法正常工作。我正在使用以下代码忽略select2输入的隐藏输入，正如我所说的，它在jquery 2.2.4上工作

$('.js-states').select2();

$.validator.setDefaults({
  ignore: ":hidden:not(.js-states)"
});

$("#this_form").validate({
  rules: {
    input_1: {
      require_from_group: [1, ".requered-group"]
    },
    input_2: {
      require_from_group: [1, ".requered-group"]
    },
    'input_3[]': {
      require_from_group: [1, ".requered-group"]
    }
  }
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.0/dist/jquery.validate.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.0/dist/additional-methods.js"></script>

<form id='this_form'>
  <select class="js-states form-control requered-group" multiple="multiple" name="input_3[]" tabindex="-1" style="display: none; width: 100%;">
    <option value="all_services">ALL</option>
    <option value='1'>1</option>
    <option value='2'>2</option>
    <option value='3'>3</option>
  </select>
  <input type='text' name='input_1' class='requered-group'>
  <input type='text' name='input_2' class='requered-group'>
  <input type='submit' name='action' value='submit'>
</form>

JS Fiddle

随意将jquery 3.3.1更改为2.2.4，并查看其工作方式。谢谢

Answer 1

jQuery 3+返回一个用于选择多个元素的空数组，而在此之前它返回null。验证插件似乎将此视为有效值。

来自http://api.jquery.com/val/

当集合中的第一个元素是select-multiple时（即设置了select属性的multiple元素），.val()返回一个包含每个选定选项的值的数组。从jQuery 3.0开始，如果没有选择任何选项，则返回一个空数组；在jQuery之前 3.0，则返回null。

您可能需要为此编写自定义验证，或要求在插件本身中解决此问题。

Select2无法通过Jquery 3.3.1上的jquery-validate插件进行验证

1 个答案: