使用按钮自动单击 Tabs Jquery答案

【问题标题】：Click automatically on Tabs Jquery with button使用按钮自动单击 Tabs Jquery
【发布时间】：2016-06-26 13:07:49
【问题描述】：

我有 html 标签和一个继续购物按钮。每个选项卡都包含少量产品。默认情况下，当我们登陆页面时，会打开第一个选项卡。要求是，当我们单击继续购物按钮时，用户将自动转到下一个选项卡，例如 tab2、tab3 然后完成，即用户在单击继续购物按钮后必须遍历每个选项卡。这是我的标签代码

<ul class="tabs-menu">
<li class="current"><a href="#tab-1">Warranty</a></li>
<li class=""><a href="#tab-2">Accessories</a></li>
<li class=""><a href="#tab-3">Software</a></li>
</ul>

<div class="tab-content" id="tab-1">
    Content of Tab 1
</div>  

<div class="tab-content" id="tab-2">
    Content of Tab 2
</div>  

<div class="tab-content" id="tab-3">
    Content of Tab 3
</div>  

<a href="#" id="continue-shopping">Continue Shopping</a>

标签的完整代码在这里： http://jsfiddle.net/syahrasi/us8uc/

【问题讨论】：

标签： javascript jquery jquery-plugins each jquery-events

【解决方案1】：

我在这里做了一个快速演示，它将尝试找到下一个选项卡，请查看更多详细信息，如果您需要：

demohttp://jsfiddle.net/Us8uc/4696/

【讨论】：

像魅力一样工作。谢谢
还有一个变化，我们可以在用户到达最后一个标签后立即关闭遍历并更改继续购物按钮链接吗？
嗨，我不确定我是否正确理解了你的想法。但我做了一点重构代码。所以现在当用户到达最后一个选项卡时它会改变按钮的样式，并且不会再返回到第一个选项卡。您可以在函数 _reachLastTab() 中进行编辑，以便为所欲为 code here

【解决方案2】：

在您的 javascript 代码中使用简单的设置器 $( ".tab-content" ).tabs( "option", "active", 1 ); 有关更多信息，请查看 api 文档 http://api.jqueryui.com/tabs/

【讨论】：

【解决方案3】：

您的按钮可以具有执行此操作的单击事件：

$("a[href='#tab-2']").trigger('click');

将#tab-2 替换为您希望通过按钮打开的任何选项卡

--编辑--

您的按钮逻辑将查看选项卡序列并在末尾添加 1 直到没有更多选项卡可以遍历。或者，在每个标签内容向前移动时都有一个“继续购物”按钮

【讨论】：