Question

我正在尝试在切换到下一个标签之前验证标签内容（使用ajax验证）。因此，当用户单击选项卡时，当前选项卡内容将发送到服务器以进行验证。当收到服务器的结果时，我切换到下一个选项卡。这是一些代码：

$('#tabs').tabs({
    select: function(event, ui) {
        ...
        validate(currentIndex, nextIndex);
        return false;
    }
});

function validate(currentIndex, nextIndex){
    $.ajax({
        ...
        complete: function(){
            $("#tabs").tabs('select', nextIndex);
        }
        ...
    }
}

您可能已经看到了问题，它是无限循环，因为验证会导致选项卡的选择处理程序导致验证等等。如果没有全局变量，我该如何解决这个问题？

感谢。

Answer 1

请查看this - official Jquery tabs documentation

除了返回true或false之外，您的验证函数不应执行任何操作。

$('#tabs').tabs(
{
    select: function(event, ui)
    {
        ...
        return validate(currentIndex, nextIndex);
    }
});

function validate(currentIndex, nextIndex)
{
    $.ajax(
    {
        ...
        success: function(data)
        {
            // example response: {"error": 0}
            if(!data.error) return true;
            else return false;
        }
        ...
    }
}

当你的标签（'select'...函数返回false时，标签不会切换，如果为true，标签将会切换 - 所以你不必在你的验证功能中这样做。

Answer 2

我不确定这是否可行（未尝试过您的代码）但是您不能使用.data(key,value)添加某种“已经验证”的标志来检查？因此，在再次输入验证函数之前，添加一个if语句来检查这一点。

JQueryUI选项卡选择和验证

2 个答案: