jQuery插件-簡單功能幫助

Question

我正在使用此jQuery插件在我正在工作的網站上顯示某種“功能列表”。 這個插件非常簡單，可以有效地完成本演示所顯示的內容。

但是，我想在其中實現一項功能。 我希望能夠在每個選項卡的內容區域中放置“上一個”和“下一個”鏈接，以切換到上一組或下一組內容。

任何人都可以在使用該jQuery插件實現該功能時應提供的幫助方面提供一些幫助嗎？

非常感謝您可能提供的任何幫助...

Answer 1

您只需要在右側選項卡元素上添加調用.click() （等效於.trigger('click')上previous/next鏈接。

演示→

標記，CSS和JS與問題中鏈接的演示相同，除了以下內容：

的HTML

<div id="content">
    <!-- snip, no changes here -->
    <span id="featureNav">
        <a id="prev">&lt; prev</a>
        |
        <a id="next" href="javascript:;">next &gt;</a>
    </span>
</div>

的CSS

#content {
    position: relative;
}

#featureNav {
    position: absolute;
    bottom: 0;
    right: 0; 
}

的JavaScript

$('#prev').click(function ()
{
    var $current = $('#tabs li a.current'),
        $prev = $current.parent().prev();

    if (!$prev.length)
    {
        $prev = $current.parent().siblings(':last');
    }

    $prev.find('a').click();
});

$('#next').click(function ()
{
    var $current = $('#tabs li a.current'),
        $next = $current.parent().next();

    if (!$next.length)
    {
        $next = $current.parent().siblings(':first');
    }

    $next.find('a').click();
});

如果您了解jQuery插件的編寫方式，那么很容易將此代碼合並到插件中。 我不確定您是否想要一次性解決方案，還是要更改插件本身。