添加自定义验证jQuery插件验证

Question

我正在使用jQuery插件验证，我想忽略文本框中的默认值。 我正在jQuery中添加cusotm验证，如下所示。 但它总是返回false。 谁能帮助我代码中的问题

$(document).ready(function () {
    $.validator.addMethod("defaultInvalid", function (value, element) {
        switch (element.value) {
            case "First Name":
                if (element.name == "First Name") return false;
        }
    });
    $("#frmReserv").validate({
        rules: {
            FName: "required defaultInvalid",
        },
        messages: {
            FName: "Please Enter Your Name",
        },
    });
});

HTML字段是

<input type="text" value="First Name" name="FName"/>

Answer 1

使用HTML5占位符属性

<input type="text" placeholder="First Name" name="FName"/>

这样您就无需检查默认值。

$("#frmReserv").validate({
        rules: {
                FName: "required",
        },

占位符的Poyfill https://github.com/mathiasbynens/jquery-placeholder

Answer 2

你可以试试看

<input type="text" placeholder="First Name" value="" name="FName"/>

Value =“”将在jquery验证时检查

Answer 3

此答案适用于旧版本的IE。

---

这是我过去使用的自定义方法...

jQuery.validator.addMethod("defaultInvalid", function(value, element) {
    return value != element.defaultValue;
});

演示： http : //jsfiddle.net/45J2Q/

---

要在焦点/模糊时自动隐藏/显示默认文本，请在输入中添加一个类并使用此类…

$('.autoclear')
.on('focus', function () {
    if ($(this).val() == $(this).prop('defaultValue')) {
        $(this).val("");
    }
})
.on('blur', function () {
    if ($(this).val() == "") {
        $(this).val($(this).prop('defaultValue'));
    }
});

的HTML

<input type="text" value="First Name" name="FName" class="autoclear" />

演示2： http ： //jsfiddle.net/45J2Q/1/