Question

有人可以告诉我为什么以下代码不起作用。它应该提醒它。但之后它会返回true，即使字段为空。

<form id="theform" method="post" action="mailme.php">
<input id="field1" name="a" value="field1" type="text" />
<input id="field2" name="b" value="field2" type="text" />
<input id="field3" name="c" value="field3" type="text" />
<input id="field4" name="d" value="field4" type="text" />

<input type="submit" />
</form>
<script>
$('#theform').submit(function(){
    $('#theform input[type=text]').each(function(n,element){
        if ($(element).val()=='') {
             alert('The ' + element.id+' must have a value');
             return false;
        }
    });
    return true;
});

</script>

Answer 1

你从.each()回调函数返回，return false打破了这个，但是没有从外部函数（你的submit处理程序）返回，而是你应该做点什么像这样：

$('#theform').submit(function(){
    var result = true;
    $('#theform input[type=text]').each(function(n,element){
        if ($(element).val()=='') {
             alert('The ' + element.id + ' must have a value');
             return result = false;
        }
    });
    return result;
});

在此处找到第一个空元素，将result设置为false并在一个语句中返回，然后从外部函数返回result ...如果没有空字段，这仍然是true。

Answer 2

您还可以将jQuery的filter()函数与回调函数一起使用，然后测试结果数组的大小，如果它为零则返回true。

$('#theform').submit(function(event) {
  var filtered = $('#theform input[type=text]').filter(function(index) {
    if ($(this).val() == '') {
      alert('The ' + this.id + ' must have a value');

      return true;
    }

    return false;
  });

  return filtered.length == 0;
});

Answer 3

你的两个return语句在不同的上下文中，所以你的每个函数都返回false，但这与你的提交函数的return语句不同，后者在最后一行总是返回true。

使用jquery进行表单验证 - 返回false

3 个答案: