javascript - 处理多个点击事件的最佳方式

Question

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

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

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

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

    <!-- etc, etc -->            

}

有没有更好的方法来处理多个点击事件，这样我就不需要为每个项目都创建一个事件。我确信必须有一种方法来委托(delegate)点击了哪个项目。

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 -->

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

Answer 1

我个人会使用类似下面的内容。它避免了单独转换大量事件，并且具有足够的可扩展性以满足您的目的。您所要做的就是向每个应该有事件的元素添加一个“clickEventClasss”类(或您喜欢的任何东西)并添加一个 id，以便您可以识别每个元素。

function waitForClick()
{

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

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

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

    });         

}