jquery绑定多个锚点

Question

我想将同一事件绑定到锚链接列表。为什么这不起作用？

标记：

<a tabindex="0" href="#contactRoles" 
    class="fg-button fg-button-icon-right ui-widget ui-state-default ui-corner-all" 
    id="contactAdd">
    <span class="ui-icon ui-icon-triangle-1-s"></span>Aggiungi contatto</a>

<div id="contactRoles" class="hidden">
<ul>
    <li><a href="#1" class="contactRole">Cliente</a></li>
    <li><a href="#2" class="contactRole">Controparte</a></li>
    <li><a href="#3" class="contactRole">Avvocato</a></li>
    <li><a href="#4" class="contactRole">Avv. Controparte</a></li>
    <li><a href="#5" class="contactRole">Altre parti</a></li>
    <li><a href="#6" class="contactRole">Domiciliatario</a></li>
    <li><a href="#7" class="contactRole">Pubblico Ministero</a></li>
    <li><a href="#8" class="contactRole">Giudice</a></li>
    <li><a href="#9" class="contactRole">Istruttori</a></li>
    <li><a href="#10" class="contactRole">Studio Legale</a></li>
</ul>
</div>

jQuery的：

$('#contactAdd').menu({
    content: $('#contactRoles').html(),
    width: 150,
    showSpeed: 300
});

$("a.contactRole").click(function(event){
    event.preventDefault();
    alert("Link " + $(this).attr("href") + " clicked");
});

我哪里错了？

修改： @everybody：是的，脚本由$（文件）.ready（...）

包装

有关详细信息，请考虑隐藏“隐藏”类的div，只能通过点击其他锚点来查看，如此截图所示。

Answer 1

编辑：根据您的评论，您已经使用了ready()功能。

另一种可能性是在页面加载后将a.contactRole元素添加到DOM 。

如果是这种情况，请尝试：

$(function() {
    $("a.contactRole").live('click', function(event){
        event.preventDefault();
        alert("Link " + $(this).attr("href") + " clicked");
    });
});

---

原始回答：

应该有效。在分配点击处理程序之前，您是否确定已加载文档？

如果在尝试分配处理程序时未加载<a>个元素，则它将无效。

示例： http://jsfiddle.net/kjSG8/

   // Wrap your code with $(function() {...}) to make sure it doesn't
   //    run until the DOM is fully loaded
$(function() {
    $("a.contactRole").click(function(event){
        event.preventDefault();
        alert("Link " + $(this).attr("href") + " clicked");
    });
});

Answer 2

这似乎是一个标准事件，您是否在$(document).ready(function() { });块内声明了它？

Answer 3

确保在DOM准备好时创建单击。您也可以说$(".contactRole").click而不是$("a.contactRole").click