jquery-ui - jQuery/jQuery UI-$(“a”)。live(“click”，…)对于选项卡不起作用

所以我有一些jQuery UI选项卡。源代码如下：

HTML：

<div class="tabs">
    <ul>
        <li><a href="#ranges">Ranges</a></li>
        <li><a href="#collections">Collections</a></li>
        <li><a href="#designs">Designs</a></li>
    </ul>
    <div id="ranges"></div>
    <div id="collections"></div>
    <div id="designs"></div>
</div>

jQuery的：

$(document).ready(function() {
    $(".tabs").tabs();
});

我的问题是，我试图使每个选项卡在单击相关链接时将页面加载到内容面板中。首先，我只是尝试在单击链接时设置所有面板的html。从下面的代码中，如果我使用方法1，则它适用于所有链接。但是，如果我使用方法2，则不会-而是仅用于选项卡中的链接（即您单击以选择选项卡的标签）。

方法1（一直用于所有链接，但不适用于调用此链接后添加的链接）：

$("a").click(function () {
    $("#ranges, #collections, #designs").html("clicked");
});

方法2（适用于所有未“制表”的链接）：

$("a").live("click", function () {
    $("#ranges, #collections, #designs").html("clicked");
});

有谁知道为什么它会这样？我真的很想让方法2正常工作，因为可能有一些链接需要添加单击事件，这些事件最初在页面最初加载后就添加到了这些事件。

提前致谢，

理查德

PS是的，在没有人说这可能是问题之前，.live和.click的函数调用都在$(document).ready()函数中-否则将根本无法工作。

编辑：

我想出的解决方案在锚点（data-url）和以下代码中包含一个额外的属性（如果无法加载页面，则会输出404 not found错误）。我的目标是在未来几周/几个月内将其扩展为更强大的功能。

$(".tabs").tabs({
    select: function (event, ui) {
       $(ui.panel).load($(ui.tab).attr("data-url"), function (responseText, textStatus, XMLHttpRequest) {
           switch (XMLHttpRequest.status) {
               case 200: break;
               case 404:
                   $(ui.panel).html("<p>The requested page (" + $(ui.tab).attr("data-url") + ") could not be found.</p>");
                   break;
               default:
                   $(ui.panel).html("<p title='Status: " + XMLHttpRequest.status + "; " + XMLHttpRequest.statusText + "'>An unknown error has occurred.</p>");
                   break;
           };
       });
   }
});

最佳答案

我不知道我是否了解您要做什么，但是基本上您想在单击选项卡后就要做一些事情吗？
Here's用于设置用于选择标签的回调函数的文档。

编辑：不知道该链接是否正常工作，您想查看事件下的select。但基本上是：

$("#tabs").tabs({
    select: function(event, ui) { ... }
});

其中ui在单击的选项卡上具有信息。

关于jquery-ui - jQuery/jQuery UI-$(“a”)。live(“click”，…)对于选项卡不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/4825492/