Question

我的jQuerymobile + PhoneGap应用我有一个包含20个字段项的页面，我正在尝试验证其中的一些字段，如下所示：

function validate() {
    if ($('#username').val() == '') {

        alert("Fullname Required")
    }
    if ($('#email').val() == '') {

        alert("Email Required")
    }
    if ($('#digitalspend').has('option').length > 0) {

        alert("Digital media Spend Required")
    }
    if ($('#objective1').has('option').length > 0) {

        alert("objective1 Required")
    }
    if ($('#objective2').has('option').length > 0) {

        alert("objective2 Required")
    }
    if ($('#objective3').has('option').length > 0) {

        alert("objective3 Required")
    }
    if ($('#name').val() == '') {

        alert("Organization Name Required")
    } else {

        loadingStart();
        setTimeout(function () {
            loadingEnd();
            $.mobile.changePage('#page2');
        }, 5000);
        return false;

        function loadingStart() {
            $.mobile.loading('show', {
                text: "Please Wait...",
                textVisible: true,
                theme: 'b',

            });
        }

        function loadingEnd() {
            $.mobile.loading("hide");
        }

    }
}

我想验证这些字段，如果一切都填满了。我需要显示加载对话框并转到下一页。但它没有按预期工作。而不是警告声明我想要逐个字段地验证整个表单。

Answer 1

为此，我建议jQuery Validation Plugin

此插件允许您为要验证的每个字段定义规则。验证后，如果不符合要求，则会使用预定义的消息标记每个字段。

从demo page：

查看此示例

// validate signup form on keyup and submit
    $("#signupForm").validate({
        rules: {
            firstname: "required",
            lastname: "required",
            username: {
                required: true,
                minlength: 2
            },
            password: {
                required: true,
                minlength: 5
            },
            confirm_password: {
                required: true,
                minlength: 5,
                equalTo: "#password"
            },
            email: {
                required: true,
                email: true
            },
            topic: {
                required: "#newsletter:checked",
                minlength: 2
            },
            agree: "required"
        },
        messages: {
            firstname: "Please enter your firstname",
            lastname: "Please enter your lastname",
            username: {
                required: "Please enter a username",
                minlength: "Your username must consist of at least 2 characters"
            },
            password: {
                required: "Please provide a password",
                minlength: "Your password must be at least 5 characters long"
            },
            confirm_password: {
                required: "Please provide a password",
                minlength: "Your password must be at least 5 characters long",
                equalTo: "Please enter the same password as above"
            },
            email: "Please enter a valid email address",
            agree: "Please accept our policy"
        }
    });

jQuerymobile验证字段值

1 个答案: