检查提交时输入是否为空

我一直在寻找解决方案，但似乎找不到任何适合我的例子。 这是我到目前为止所得到的：

$("#register-form").submit(function(){ if($(".required input").val() == '') { alert("Please fill in all the required fields (indicated by *)"); $(".required").addClass('highlight'); // $('input[type=submit]', this).attr('disabled', 'disabled'); return false; } }); 

出于某种原因，当我提交表格时没有填写任何必填字段（有两个），那么它可以工作，但如果填写了其中一个，则不会。

有什么想法吗？

谢谢

OSU

Answer 1

您的代码存在的问题是，您只是测试了您已根据需要标记的第一个字段。 $(".required input")仅返回表单中与该选择器匹配的第一个输入。

这将循环遍历标记所需的表单中的所有输入（根据您的选择器）。 如果找到值为”的那个，则将submit函数设置为返回false并突出显示空白字段。 它还会从现在有效但在早期表单提交尝试中无效的字段中删除突出显示类。

 $("#register-form").submit(function(){ var isFormValid = true; $(".required input").each(function(){ if ($.trim($(this).val()).length == 0){ $(this).addClass("highlight"); isFormValid = false; } else{ $(this).removeClass("highlight"); } }); if (!isFormValid) alert("Please fill in all the required fields (indicated by *)"); return isFormValid; }); 

Answer 2

 $("#register-form").submit(function() { $('.required input').each(function() { if ($($this).val() == '') { $(this).addClass('highlight'); } }); if ($('.required input').hasClass('highlight')) { alert("Please fill in all the required fields (indicated by *)"); return false; } } 

试一试。

编辑移动警报，以便用户不会因为警报消息而被吹走，很好的捕获。

Answer 3

简单解决方案！：

  function checkForm(){ $("input.required").css("border","1px solid #AFAFAF"); $("input.required[value=]").css("border-color","red"); if($("input.required").val().length<2)return false; return true; } 

Answer 4

也许你的情况应该是这样的：

 if($("input.required").val() == '')... //Pay attention to the selector 

导致您的选择器找到.required的所有输入子项

Answer 5

基于David Fell的回答，（在我看来有错误）你可以这样做：

 $("#register-form").submit(function() { $('.required input').each(function() { if ($(this).val() == '') { $(this).addClass('highlight'); } }); if ($('.required input.highlight').size() > 0) { alert("Please fill in all the required fields (indicated by *)"); return false; } } 

Answer 6

如果

 $(".required input") 

然后匹配多个元素

 $(".required input").val() == '' 

可能不会做你期望的事情。

Answer 7

您无法像这样引用所有表单输入的值。

 var valid = true; $('.required input').each(function(){ if( $(this).val() == '' ){ valid = false; $(this).addClass('highlight'); } }); 

顺便说一下， 表单插件会为你完成这个。

Answer 8

在这种情况下，输入或id的名称使用输入的id

HTML：

JQUERY：

 if (!$("#id").val()) { do something... } 

Answer 9

此代码获取所有表单字段，包括选择列表和复选框等。

 var save_prms = $("form").serializeArray(); $(save_prms).each(function( index, element ) { alert(element.name); alert(element.val); });