4

在我的应用程序中单击链接时，我正在尝试完成一些操作。

例如，我正在创建一个在文档中有多个内部链接的手册。目前，我会像这样处理它们：

function waitForClick()
{
    $('#about').click(function()
    {
        $('#container').slideDown();
    });

    $('#using').click(function()
    {
          changeContent...
    });

    <!-- etc, etc -->            

}

有没有更好的方法来处理多个点击事件，这样我就不需要每个项目的事件。我确信必须有一种方法可以委托单击了哪个项目。

HTML：

<li><a id="about" href="#">About this Application</a></li>
<li><a id="using" href="#">Using this Manual</a></li>
<li><a id="pages" href="#">Pages:</a></li>

<!-- etc, etc -->

这应该是手册的目录。所以会有很多本地链接。

4

3 回答 3

1

您可以将点击事件绑定到类而不是 ID。

<a class="navigationLink" href="home.com">Home</a>
<a class="navigationLink" href="about.com">About</a>
<a class="navigationLink" href="contactus.com">Contact Us</a>

$(".navigationLink").click(function() {
    //Do something cool
});
于 2012-07-08T16:09:43.043 回答
1

我个人会使用类似下面的东西。它避免了单独投射大量事件，并且可扩展性足以满足您的目的。您所做的只是为每个应该有事件的元素添加一个“clickEventClasss”类（或任何您喜欢的）并添加一个 id，以便您可以识别每个元素。

function waitForClick()
{

    $('.clickEventClass').click(function() {

        var id = $(this).attr('id');

        switch(id) {
            case 'about':
            //Logic
            break;
        case 'using':
            //Logic
            break;
        }

    });         

}
于 2012-07-08T16:07:07.633 回答
0

您可以使用将点击事件分配给的类。

在此之后，以下是可能的：

$(".class").click(function()
{
    if($(this).attr("id") == "about")
    {
        //code here
    }
    else if($(this).attr("id") == "using")
    {
        //code here
    }
}
于 2012-07-08T16:10:39.910 回答