jquery ui标签事件

我试图调用一个函数，当一个标签被加载，但它似乎事件永远不会触发，我无法弄清楚我做错了什么。jquery ui标签事件

<div id="tabs" style="padding-top:0px;margin-top:0px"> 
    <ul> 
    <li><a href="#tabs-scripting">Scripting</a></li> 
    <li><a href="#tabs-scripting-history">Scripting History</a></li> 
    <li><a href="#tabs-equipment">Equipment List</a></li> 
    <li><a href="#tabs-syslogs">Syslogs</a></li> 
    <li><a href="#tabs-visio">Visio</a></li> 
    <li><a href="#tabs-misc">Misc</a></li> 
    </ul> 

    <div id="tabs-visio"> 
    <img id="visio_topology" src="/Scripting/customer/7229_topology.png"> 
    <!-- Visio Tab div end --> 
    </div>

JS：

$('#tabs').tabs({ 
    select: function(event, ui) { 
     window.location.hash = ui.tab.hash; 
    } 
    }); 

    $("#tabs-visio").tabs().bind("tabsload", function(event, ui) { 
    console.log('hello world'); 
    });

用Firebug我从来没有看到 '世界你好'。我是jquery的新手，我知道我必须错过一些简单的东西，我只是无法弄清楚什么。

来源

2011-12-19 user1106281

尝试在绑定到tabsload事件处理程序后初始化tabs。试试这个

$("#tabs-visio").bind("tabsload", function(event, ui) { 
    console.log('hello world'); 
    }).tabs();

来源

2011-12-19 16:38:24 ShankarSangoli

我不使用jQuery UI选项卡经历，但我看了一下你的问题，这是我发现：

标签特定事件的#tabs元素上触发。
事件tabsload在标签具有外部URL时触发。在这种情况下，使用AJAX加载内容，并且当AJAX请求成功时，则会触发tabsload事件。
如果本地或缓存的URL只有tabselect和tabshow事件被触发。所以你应该使用这些事件之一。

纠正我，如果我错了，但似乎你想加载某种大图像，当选项卡被选中。在你的例子中，img将在页面加载时被加载。如果你想懒洋洋地加载图像，然后试试这个：

$('#tabs').tabs({ 
    select: function(event, ui) { 
     // if "Visio" tab is selected and the image is not in DOM ... 
     if(ui.index === 4 && $("#visio-topology").length === 0) { 
     // ... append it to the div 
     $("#tabs-visio").append($("<img>", { 
      id: 'visio-topology', 
      src: '/Scripting/customer/7229_topology.png' })); 
     }    
    } 
});

HERE您可以用活动实验，看到的差异。

来源

2011-12-19 18:16:24 kubetz

这真的是你的整个HTML？如果是这样，那么您在#tabs div上缺少结束标记。 HTML片段末尾的结束标记正在关闭＃tabs-visio div。无效的HTML（如果真的存在）会让jquery烦恼。

来源

2013-01-10 14:51:30 Jon

哇，我刚刚注意到这个问题已经过了一年多了。我希望你能在此期间把它整理好！ – Jon 2013-01-10 14:53:03

jquery ui标签事件

回答

相关问题