Question

我为jquery编写了全局迷你表单验证。这里; 这段代码，All表单提交事件监听器。

$('form').submit(function() {
       var returnfalse = 'true';
        var min;
        var maxlength;

        $('input[type=text], input[type=password]', this).removeClass('error');

        jQuery.each( $('input[type=text], input[type=password]', this) , function() {


            min = $(this).attr('min');
            maxlength = $(this).attr('maxlength');
            inputValue = $(this).val().trim();



            if( $(this).attr('min') != '' && $(this).attr('min') != null && inputValue.length < min ) {
                alert('ERROR !!!!!')
                $(this).addClass('error');
                $(this).focus();
                returnfalse = 'false';
            }



            if(returnfalse != 'true')
                return false;


        });

        if(returnfalse != 'true')
            return false;

    });

和其他提交活动;

$('#registerForm').submit(function(){
   alert('this Work...');
});

当#registerForm提交时，这两个事件有效。但是我在事件上写了返回false。

为什么第二次活动有效？

Answer 1

两个考虑因素：

1）你应该对事件调用stopImmediatePropagation（）来阻止警告（http://jsfiddle.net/R7uwa/）（如果我记得正确地返回false等于.preventDefault（）和stopPropagation（）。所以在这种情况下没有警报：

$('form').submit(function(e){
    e.stopImmediatePropagation();
    return false;
});


$('form').submit(function(){
    alert('hi');
});

2）以这种方式绑定的事件按绑定顺序执行，因此您应首先绑定验证，以便停止传播（http://jsfiddle.net/R7uwa/1/）。但是，如果你看一下这个问题jQuery event handlers always execute in order they were bound - any way around this?，你会发现有一个解决方法。

在这种情况下，你会发出警告

$('form').submit(function(){
    alert('hi');
});


$('form').submit(function(e){
    e.stopImmediatePropagation();
    return false;
});

Answer 2

return false基本上可以防止jQuery中事件的默认浏览器行为。

在第一个代码示例中，return false将确保避免默认浏览器的表单提交操作，但它不会避免在单个事件上调用多个方法。

当您在单个表单提交事件上绑定两个方法时，它将一个接一个地调用这两个方法，并且第一个方法将确保避免浏览器的默认提交操作。

Jquery多提交事件

2 个答案: