Jquery preventdefault()函数不起作用

时间:2012-06-05 12:54:35

标签: javascript jquery jquery-ui javascript-events

这是我的Jsfiddle

实际上我正在尝试在提交之前验证文本字段。 如果文本字段为空,我想显示errormsg_box,如果不是则提交表单。 但这里没有用 这是我的剧本:

$("form").submit(function(event) {

    var text_val = $('#emailid').val();
    alert(text_val);
    if (text_val != ' ') {
        $('.errormsg_box').show();
        return false;
        event.preventdefault();
    }
    else if (text_val != '') {
        $('.errormsg_box').hide();
        return true;
    }
});

3 个答案:

答案 0 :(得分:2)

if ($.trim(text_val) === "") {
    return false;
    // Or
    event.preventDefault(); // event.preventdefault()
                            // javascript is case sensitive.
}

完整代码:

$("form").submit(function(event) {
    var text_val = $('#emailid').val();

    if ($.trim(text_val) === "") {
        $('.errormsg_box').show();
        return false;
    }
    else 
        $('.errormsg_box').hide();
});​

Live DEMO

如果您想验证文本是有效的电子邮件地址:

var regex = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
if (!regex.test($.trim(text_val)))
    ... Error

Live DEMO

答案 1 :(得分:1)

$("form").submit(function(event) {    
    var text_val = $.trim($('#emailid').val()); // $.trim() for remove space
    if (!text_val) { // check for empty
        $('.errormsg_box').show();
        return false;
        //or
        //event.preventDefault();
    }
}); 

<强> DEMO

答案 2 :(得分:0)

编辑这可能是更好的解决方案:

<input id="emailid" class="required email" />

并使用jQuery验证插件: http://bassistance.de/jquery-plugins/jquery-plugin-validation/

$("#form").validate();

这样的事情:

$(document).ready(function () {
    $("#form").submit(function () {
        var container = $('errormsg_box');

        var validator = $("#form").validate({
            errorContainer: container,
            errorLabelContainer: $("ul", container),
            ignore: ":not(:visible)", 
            wrapper: 'li',
            rules: {
                emailid: { required: true, email: true }
            },
            messages: {
                emailid: "The e-mailaddress is invalid!"
            }
        });
        if ($("#form").valid()) {
            alert('ok nice!');
        }      
    });
});