Question

但是当我点击提交时它没有被解雇。它提交但不做任何事情。有任何想法吗？警报甚至没有被调用：（

我正在执行此操作的页面是我的Checkout页面：

http://rsatestamls.kaliocommerce.com

（需要购物车中的商品才能继续结帐）

我的Javascript代码是：

<script>

$(document).ready(function () {
    $("#Method input:checkbox").change(function () {
        if (this.checked) {
            var checkname = $(this).attr("name");
            $('input[type=checkbox][id=OnAccount]').prop('value', 'True')
            $("input:checkbox[name='" + checkname + "']").not(this).removeAttr("checked");
        } else {
            $('input[type=checkbox][id=OnAccount]').val('No');
        }
    });
    $("#CheckoutOptions input:checkbox").change(function () {
        if (this.checked) {
            var checkname = $(this).attr("name");
            $("input:checkbox[name='" + checkname + "']").not(this).removeAttr("checked");
        }
    });
});

$("#CheckOut").submit(function (event) {
    alert("Handler for .submit() called.");
    jQuery.validator.setDefaults({
        debug: false,
        success: "valid"
    });
    $("#CheckOut").validate({
        rules: {
            FirstName: {
                required: true
            },
            LastName: {
                required: true
            },
            Email: {
                required: true,
                email: true
            },
            Phone: {
                required: true,
                digits: true
            },
            Address1: {
                required: true
            },
            City: {
                required: true
            },
            PostalCode: {
                required: true,
                digits: true
            },
            Country: {
                required: true
            },
            State: {
                required: true
            },
            pwd: {
                required: true
            },
            pwd_confirm: {
                required: true
            },
            FName_SHIP: {
                required: true
            },
            LName_Ship: {
                required: true
            },
            Phone_Ship: {
                required: true,
                digits: true
            },
            Address1_Ship: {
                required: true
            },
            City_Ship: {
                required: true
            },
            PostalCode_SHIP: {
                required: true,
                digits: true
            },
            COUNTRY_SHIP: {
                required: true
            },
            State_SHIP: {
                required: true
            },
            NameOnCard: {
                required: {
                    depends: function (element) {
                        return $("#CCMethod").is(":checked");
                    }
                }
            },
            CreditCardType: {
                required: {
                    depends: function (element) {
                        return $("#CCMethod").is(":checked");
                    }
                }
            },
            CardNumber: {
                required: {
                    depends: function (element) {
                        return $("#CCMethod").is(":checked");
                    }
                }
            },
            CardExpMonth: {
                required: {
                    depends: function (element) {
                        return $("#CCMethod").is(":checked");
                    }
                }
            },
            CardExpYear: {
                required: {
                    depends: function (element) {
                        return $("#CCMethod").is(":checked");
                    }
                }
            },
            CVC: {
                required: {
                    depends: function (element) {
                        return $("#CCMethod").is(":checked");
                    }
                }
            },
            customernumber: {
                required: {
                    depends: function (element) {
                        return $("#OnAccount").is(":checked");
                    }
                }
            }
        }
    });
});
populateCartTotal();

</script>

Answer 1

您的submit处理程序不在$(document).ready块中，但应该在。{1}}块中。处理程序永远不会附加。

事实上，你根本不应该使用submit处理程序。只需将验证调用放在ready块中即可。请参阅此处的演示：http://jquery.bassistance.de/validate/demo/

<script>

$(document).ready(function () {
    $("#Method input:checkbox").change(function () {
        if (this.checked) {
            var checkname = $(this).attr("name");
            $('input[type=checkbox][id=OnAccount]').prop('value', 'True')
            $("input:checkbox[name='" + checkname + "']").not(this).removeAttr("checked");
        } else {
            $('input[type=checkbox][id=OnAccount]').val('No');
        }
    });
    $("#CheckoutOptions input:checkbox").change(function () {
        if (this.checked) {
            var checkname = $(this).attr("name");
            $("input:checkbox[name='" + checkname + "']").not(this).removeAttr("checked");
        }
    });

    // move this stuff to here
    jQuery.validator.setDefaults({
        debug: false,
        success: "valid"
    });
    $("#CheckOut").validate({
        rules: {
            // all those rules here
        }
    });
});

populateCartTotal（）;

Answer 2

作为Ed回答的附录，我还建议您在submit（）处理程序的外设置验证方案。

尝试使用.submit在表单提交时触发jquery验证

2 个答案: