javascript - 提交表单时如果两个div具有相同的值如何返回false

Question

我有一个表单在 div 中有很多选择，所以我希望当用户提交表单时，如果有两个或多个 div 具有相同的值，表单示例第一个具有此值：1 一个，第三个具有相同的值所以不要提交并返回false，那么javascript或jquery有什么方法可以帮助我做到这一点吗？

$("form").submit(function() {
   alert("2 div or more have the same value, please change them");
   return false;
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <div>
      <select class="number">
          <option value="">select</option>
          <option value="1">1</option>
          <option value="2">2</option>
          <option value="3">3</option>
     </select>
     <select class="letter">
          <option value="">select</option>
          <option value="one">one</option>
          <option value="two">two</option>
          <option value="three">three</option>
     </select>
 </div>
  <div>
      <select class="number">
          <option value="">select</option>
          <option value="1">1</option>
          <option value="2">2</option>
          <option value="3">3</option>
     </select>
     <select class="letter">
          <option value="">select</option>
          <option value="one">one</option>
          <option value="two">two</option>
          <option value="three">three</option>
     </select>
  </div>

  <div>
     <select class="number">
          <option value="">select</option>
          <option value="1">1</option>
          <option value="2">2</option>
          <option value="3">3</option>
     </select>
     <select class="letter">
          <option value="">select</option>
          <option value="one">one</option>
          <option value="two">two</option>
          <option value="three">three</option>
     </select>
  </div>
  <input type="submit"/>
</form>

标签： javascriptjqueryhtml

Answer 1

您可以尝试使用此 javascript 代码来保留您的 html

$("form").submit(function(event)
{
   var selects = $('select');
   selects.each(function(i,select1){        
   var found = false;
      selects.each(function(j,select2){         
           if(i!=j && select1.value == select2.value){
               alert("2 div or more have the same value, please change them");
               found = true;
               event.preventDefault();
               return false;
           }
       });
       if(found){
           return false;
       }
   });
});