如何筛选任何选择字段的表单提交，其中选择了空白或无值的选项？

Question

我有形式标记像...

<form id='cart' action="/cart/add" method="post"> 
    <div id="product-variants"> 
     <div class="selector-wrapper clearfix"> 
     <select class="product-select" name='id[]'> 
      <option value="">&nbsp;---</option> 
      <option value="a">Option A</option> 
      <option value="b">Option B</option> 
      <option value="c">Option C</option> 
     </select> 
     <select class="product-select" name='id[]'> 
      <option value="">&nbsp;---</option> 
      <option value="a">Option A</option> 
      <option value="b">Option B</option> 
      <option value="c">Option C</option> 
     </select> 
     </div> 
    </div> 
</form> 

我想写过滤掉（禁用）任何选择输入其中的值是空白的，因此不会发送到后端的例程我没有控制权。这里是我根据我在这里找到的其他问题的答案想出的。

jQuery(function(){ 
    jQuery("#cart").submit(function(){ 
    $(this).children(':input[value=""]').attr("disabled", "disabled"); 
    $(this).children('select option[value=""]').parent().attr("disabled","disabled"); 
    return true; // ensure form still submits 
    }); 
}); 

虽然提交函数的第二行不起作用。我尝试过几种组合，但无法弄清楚如何实现这一点。任何人都可以启发我，我做错了什么？

Answer 1

你可以试试这个

$(this).find('select').filter(function() { 
     return this.value === '' 
}).prop("disabled", true); 

OR

$(this).find('select').each(function() { 
    if (this.value == '') { 
     $(this).prop("disabled", true); 
    } 
}); 

全码

jQuery(function() { 
    jQuery("#cart").submit(function(e) { 
     // e.preventDefault(); 
     $(this).find('select').each(function() { 
      if (this.value == '') { 
       $(this).prop("disabled", true); 
      } 
     }); 
    }); 

    jQuery("#cart").submit(); 
});​ 

Check Fiddle

Another One

Answer 2

jQuery("#cart").submit(function(e) { 
    jQuery(this).find(':input').prop('disabled',function(){/* ':input will find select and input tags*/ 
     return $(this).val() ==''; 
    }); 
}); 

返回true在提交处理多余的。初始代码的另一个问题是select和input元素不是窗体的子项。 children是直接后代