将选项卡添加到现有选项卡菜单

Posted 2023-03-16

【中文标题】将选项卡添加到现有选项卡菜单

【英文标题】：Add Tab to existing Tab menu

【发布时间】：2017-05-18 16:20:02

【问题描述】：

是否可以在现有的选项卡菜单中添加选项卡？ 我有一个类似的标签

<ul class="nav nav-tabs my-tabs" role="tablist"><li class="dropdown pull-right tabdrop hide"><a class="dropdown-toggle" data-toggle="dropdown" href="#"><i class="icon-align-justify"></i> <b class="caret"></b></a><ul class="dropdown-menu"></ul></li>
<li class="active"><a href="#tab0" role="tab" data-toggle="tab">Write Mail</a></li>
<li><a href="#tab1" role="tab" data-toggle="tab">Hint</a></li>
<li><a href="#tab2" role="tab" data-toggle="tab" onclick="loadTab(2, 'custom', 0)">Custom</a></li>
<li><a href="#tab3" role="tab" data-toggle="tab" onclick="loadTab(3, 'Mails', 0)">Mails</a></li>
<li><a href="#tab4" role="tab" data-toggle="tab" onclick="loadTab(4, 'customer', 0)">Customer Logs</a></li>
<li><a href="#tab5" role="tab" data-toggle="tab">Options</a></li>
<li><a href="#tab6" role="tab" data-toggle="tab" onclick="loadTab(6, 'smartlog', 0)">Smartlogs</a></li>

是否可以使用 javascript 或其他方式添加选项卡？选项卡是软件自己生成的，所以不能直接添加，只能用可以插入代码的钩子。

谢谢！

【问题讨论】：

是的，您可以使用 JS/jQuery 插入/附加新的 li 标签。虽然我建议将您的点击处理程序移动到外部脚本，然后使用数据属性选择参数。这将使您更容易添加新选项卡并处理它们上的点击事件。

与@MohitBhardwaj 一致，尝试将其自动化。从 Rohan 推广解决方案并在代码中生成每个选项卡。

参考这个：***.com/questions/20673959/…

【参考方案1】：

试试这个，

$(function()
    $('.my-tabs').append(
       '<li><a href="#tab7" role="tab" data-toggle="tab" onclick="loadTab(7,\"NewTab\", 0)">New Tab</a></li>'
    );
);