不理解与jquery ui选项卡的事件代表团

Question

我只是没有得到与jquery ui选项卡的事件代表团，或根本没有！

我得到了jquery ui选项卡的代码，并加载完美的Ajax工作的页面。但是我无法理解事件委派。我加载了4个带有外部内容的选项卡，具体取决于打开的选项卡。在这些选项卡中，我希望将相同的小部件附加到输入按钮和链接。到目前为止，我的代码看起来像这样

JS进行页面的其余部分已经装

$("button, input:submit, a", ".create_button").button(); 
$("a.edit_button").button({ 
     icons: {primary: 'ui-icon-pencil'} 
    }); 
    $("a.delete_button").button({ 
     icons: {primary: 'ui-icon-circle-close'} 
    }); 
    $("a.active_button").button({ 
     icons: {primary: 'ui-icon-lightbulb'} 
    }); 

JS对于标签：

<script type="text/javascript"> 
     $(document).ready(function() { 
      $("#tabs").tabs({ 
      ajaxOptions: {error: function(xhr, status, index, anchor) 
             {$(anchor.hash).html("Could not load");}}, 
      selected: 0}) 
     }); 
</script> 

HTML

<div id="tabs"> 
    <ul> 
    <li><a href="ajax_passes/member_id/9">Pass Information</a></li> 
    <li><a href="ajax_entries/member_id/9">Entries</a></li> 
    <li><a href="ajax_event/member_id/9">Event Administration</a></li> 
    <li><a href="ajax_profile/member_id/9">Profile</a></li> 
    </ul> 
</div> 

我在这里学习了堆栈溢出，我必须将一个click事件附加到live（）的#tabs div上。无论如何，最佳猜测。

但是我找不到任何适合我的例子和对事件委派的有限理解。

任何帮助表示赞赏。 里克

Answer 1

原来，.live（）只适用于事件。因此，尽管我可以将某些内容绑定到链接，但直到链接发生事件（即单击或悬停）才会真正起作用。

解决方法是将事件动态添加到带有加载内容的链接，但这非常棘手，并且会给应用程序增加很多开销。相反，我选择以不同的方式在加载的内容中进行样式化。在学习这个过程中，我最终使用live（）进行了表单提交，并在提交后重新加载了内容。

谢谢你们的帮助。 RWL。你最终没有真正回答这个问题，但是你的刺激使我朝着正确的方向发展，并且我学到了很多东西。我最终能够自己解决问题。你知道，给一个人钓鱼或教他钓鱼，yadi yadi yadi ...

谢谢！

Answer 2

现在，你有“错误”被处理，但没有别的。你需要处理“成功”或“完整”......实际上，你为什么要使用AJAX？你似乎没有要求从页面以外的任何数据？

Answer 3

这似乎是关键，你的问题是这样的：

那些我想同样的部件连接到输入按钮和链接标签内。

听起来像是你要使用的标签控件的“秀”的方法：

$(document).ready(function() { 
     $("#tabs").tabs({ 
     ajaxOptions: {error: function(xhr, status, index, anchor) 
            {$(anchor.hash).html("Could not load");}}, 
     selected: 0, 
     show: function() { 
     $([selectors for buttons or jQuery UI widgets in your tabs]).button(); 
     } 
    }) 
}); 

FWIW，这个问题是不是真正的event delegation。那篇文章对理解这个概念很有用。