Question

我在jQuery tab div中有一个加载了AJAX的表单：

<div id="tabs-2">
    <form id="frmLogin" name="frmLogin" class="cmxform" method="post" action="actions/login.php">
        <p>
            <label>Username</label>
            <input type="text" id="username" name="username" maxlength="30" />
        </p>
        <div class="clear"></div>
        <p>
            <label>Password</label>
            <input type="password" id="password" name="password" maxlength="40" />
        </p>
        <p>
        <input class="submit" type="submit" id="submit" value="Login" />
        </p>
        <div class="clear"></div>
    </form>

</div>

表单提交到列出的PHP文件。使用Form and Validation jQuery插件的这个.js文件通过AJAX提交表单。 PHP文件回显JSON数据：

$(document).ready(function() { 
$("#frmLogin").validate({
                    rules: {
                            username: {
                                required: true,
                                minlength: 6
                            },
                            password: {
                            required: true,
                            minlength: 6
                            },
                            },
                            submitHandler: function(form) {
                                $("#frmLogin").ajaxSubmit({
                                                        dataType: 'json',
                                                        success:    processLogin,
                                                        })
                            }
});
function processLogin(data) {
    if (data.un) {
        $("div#tabs-2").slideUp(function() {
            $("li#login").html('<a href="ajax/loggedin.html">Welcome, '+data.fn+'</a>');
        });
    } else {
        alert("uh-oh"); 
    }
}
});

一切正常。我有一个以前读过“登录”的链接来回读欢迎信息。现在我想用多个用户选项替换该选项卡的内容（登录表单）。

问题：带有欢迎消息的链接不再用作选项卡。单击时，它会将浏览器定向到“ajax / loggedin.html。”

我已经尝试在“loggedin.html”文件中重新设置tabs功能，并在“login.js”中的processLogin函数中调用它。我的下一个修复尝试是更改processLogin函数中tabs-2 div的html内容，但这似乎会产生很多笨重的代码。

有关阻止禁用标签行为的任何建议吗？

Answer 1

这是典型的when-code-is-run问题。您正在设置选项卡行为以检查选项卡并进行设置。然后加载新代码，但尚未初始化这些代码。

解决方案是使用委托（或实时）而不是直接点击事件或初始化ajax回调中的选项卡。后者是解决这个问题的最佳方案。

表单提交后禁用jQuery选项卡

1 个答案: