1

我正在使用validity.js ( http://validity.thatscaptaintoyou.com/ ) 来验证一个名为contactos.html 的文件中的表单。

我还使用 css-tricks “重新思考动态页面替换内容”（http://css-tricks.com/rethinking-dynamic-page-replacing-content/）教程来加载 div 内容。

这样，contactos.html 中的这个表单通过 jquery 加载到 index.html 页面中的 div 中。

问题是当我想将validity.js应用于表单时，当它通过jquery加载到index.html页面时，每次我点击提交它都会重新加载页面并且不进行验证。

此验证仅在我加载表单原始页面（即contactos.html）时才有效。

重新思考动态页面替换内容代码：

$(window).bind("load", function() {

    if(Modernizr.history){

    var everPushedSomething = false;

    var newHash      = "",
        $mainContent = $("#content"),
        baseHeight   = 0,
        $el;

    $("#selectGoTo select").change(function() {
        _link = $(this).val();
        //alert(_link)
        history.pushState(null, null, _link);
        loadContent(_link);
        everPushedSomething = true;
        return false;
    });

    $("nav").on("click", "a", function() {
        var _link = $(this).attr("href");
        //alert(_link);
        history.pushState(null, null, _link);
        loadContent(_link);
        everPushedSomething = true;
        return false;
    });

    function loadContent(href){
        $mainContent
                .find("#contentDiv")
                .fadeOut(400, function() {
                    $mainContent.hide().load(href + " #contentDiv", function() {
                        $mainContent.fadeIn(400, function() {

                            $("#navSubMenu").on("click", "a", function() {
                                var _link = $(this).attr("href");
                                //alert(_link);
                                history.pushState(null, null, _link);
                                loadContent(_link);
                                everPushedSomething = true;
                                return false;
                            });
                            if (href === "contactos.html") {
                                initialize();
                                $("#newsletter-form").addClass('sky-form');
                            } else {
                            };
                            console.log();
                        });
/*
                        $mainContent.fadeIn(200, function() {
                            $pageWrap.animate({
                                height: baseHeight + $mainContent.height() + "px"
                            });
                        });
                        $("nav a").removeClass("current");
                        console.log(href);
                        $("nav a[href$="+href+"]").addClass("current");
*/
                    });
                });
    }

    $(window).bind('popstate', function(){
        if (everPushedSomething) {
            $.getScript(location.href);
            _link = location.pathname.replace(/^.*[\\\/]/, ''); //get filename only
        }
        everPushedSomething = true;

        loadContent(_link);
    });

} // otherwise, history is not supported, so nothing fancy here.


});

有效码：

$("form").validity(function() {
    $("#fullname")    
        .require("O Nome é obrigatório.")
        .minLength(12, "O Nome deverá ser mais detalhado.");
    $("#email")   
        .require("O Email é obrigatório.")
        .match("email", "Deverá indicar um email válido.");
    $("#assunto")
        .require();
    $("#confirmacao")
        .checkboxChecked("Por favor confirme que pretende enviar este email");  
    //$("#assunto").require("Por favor seleccione um assunto"); 

});

$.validity.setup({
    // You may change the output mode with this property.
    outputMode: "summary",

    // The this property is set to true, validity will scroll the browser viewport
    // so that the first error is visible when validation fails.
    scrollTo: false,

    // If this setting is true, modal errors will disappear when they are clicked on.
    modalErrorsClickable: true,

    // If a field name cannot be otherwise inferred, this will be used.
    defaultFieldName: "This field"
});

我必须做什么才能在通过 jquery 加载表单时提交按钮验证表单而不是加载contacts.html 页面

提前致谢

4

1 回答 1

0

您应该在从 html 页面加载内容后调用有效性代码，尝试在initialize()函数内部或之后添加它

于 2013-06-30T06:24:57.973 回答