在jQuery UI中删除动态创建的选项卡
，可以使用以下步骤：
- 首先，使用jQuery的
tabs方法创建一个选项卡容器。例如：
$("#tabs").tabs();- 接下来，使用jQuery的
add方法动态添加选项卡。例如：
$("#tabs").tabs("add", "#newTab", "New Tab", 2);上述代码将在选项卡容器中添加一个id为newTab的选项卡，显示名称为"New Tab"，并将其放置在索引为2的位置。
- 要删除动态创建的选项卡，可以使用jQuery的
remove方法。例如：
$("#newTab").remove();上述代码将删除id为newTab的选项卡。
完整的示例代码如下：
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$(function() {
$("#tabs").tabs();
$("#addTabButton").click(function() {
$("#tabs").tabs("add", "#newTab", "New Tab", 2);
});
$("#removeTabButton").click(function() {
$("#newTab").remove();
});
});
</script>
</head>
<body>
<div id="tabs">
<ul>
<li><a href="#tab1">Tab 1</a></li>
<li><a href="#tab2">Tab 2</a></li>
</ul>
<div id="tab1">
<p>Content for Tab 1</p>
</div>
<div id="tab2">
<p>Content for Tab 2</p>
</div>
</div>
<button id="addTabButton">Add Tab</button>
<button id="removeTabButton">Remove Tab</button>
</body>
</html>上述代码中，点击"Add Tab"按钮将添加一个新的选项卡，点击"Remove Tab"按钮将删除该选项卡。
对于这个问题，腾讯云没有特定的产品或链接与之相关。
相关·内容
1回答
如何删除使用jQuery UI库动态创建的选项卡？它似乎没有提到任何关于在库的文档中删除选项卡的内容。我需要能够删除当前活动的选项卡，并删除所有选项卡。
浏览 17提问于2019-11-30得票数 0
2回答
我在jspx页面上有7个jquery选项卡。我动态地添加了一个新的选项卡来呈现搜索表单中的搜索结果。到现在为止还好。现在，当用户单击任何其他选项卡时，必须删除新创建的“搜索结果”选项卡。selectedIndex = ui.index;
if ((selectedIndex < 8) &am
浏览 1提问于2011-11-01得票数 0
回答已采纳
2回答
我有一个使用jquery选项卡的页面。在这个页面中，我需要动态地添加和删除选项卡。实现了该功能。现在，每次我添加一个新选项卡时，jquery都会自动为该选项卡生成一个id。比如ui-tabs-1，ui-tabs-3等，我需要知道，有什么方法可以得到这个id的索引吗？(附加的1、3 )。因为，我需要在选项卡内使用id作为一些功能，
浏览 0提问于2013-07-18得票数 0
我有一组动态创建的jQuery选项卡。每个选项卡都有一个带有它的iFrame。label}</a> <span class="ui-icon ui-icon-close">Remove Tab</span></li>', }
浏览 2提问于2010-11-30得票数 1
回答已采纳
根据jQuery-UI1.9选项卡- -动态添加新选项卡的升级指南，只需执行以下操作：<div id='tabs'> <li><a href='#tab1/a></li>"
浏览 3提问于2013-02-05得票数 19
回答已采纳
select2元素位于动态加载的html ( jQuery ui选项卡中的动态选项卡)中。有一种情况是，我通过为容器div调用jQuery remove来删除动态html (删除选项卡)，并且稍后可能会再次加载它。
第一次，一切都运行得很完美。从第二次开始，当我打开select2元素时，我从select2 js中</em
浏览 1提问于2014-01-13得票数 1
我使用的是jquery UI选项卡，其中一个选项卡面板包含UI portlet。问题是portlets不在选项卡边界内，下面是一个屏幕截图：我一
浏览 1提问于2010-03-19得票数 0
回答已采纳
我想在ApacheWicket7.3中创建一个动态选项卡面板，并添加和删除AjaxTabs。因为AjaxTab是一个JQuery扩展，所以我也打算从这个扩展中使用TabbedPanel。要删除选项卡，我想添加一个x链接到选项卡头，它将表单发送到选项卡上进行验证。如果表单存在验证错误，则将打开对话框。我想像这样扩展TabbedPanel：
import com.googlecode.wicket.jquery<
浏览 4提问于2016-07-04得票数 0
回答已采纳
4回答
如何清空(删除所有选项卡) jQuery UI选项卡？ $('#content').tabs('remove', i);但是制表符(‘length’)总是返回0，即使在控件中</
浏览 4提问于2009-04-06得票数 1
回答已采纳
1回答
ui.draggable.hasClass("dropped")) }});
此代码在预加载的div上运行良好。但是当我创建动态选项卡时，它不起作用。如何在动态选项卡
浏览 2提问于2014-03-25得票数 1
回答已采纳
我已经使用jQuery UI选项卡创建了一个界面，但是我的一个要求是有一个' all‘选项，可以同时显示选项卡组中所有页面的内容。我的标签是从PHP动态生成的，我给每个标签按钮一个id，这样结果就会如下所示：
<li ><a id='tabProjectBrief' href="#section1">Project Brief</$('
浏览 0提问于2009-02-13得票数 0
回答已采纳
2回答
我有一个使用动态选项卡的UI，因此内容可以加载到选项卡中，然后可以关闭选项卡并从页面中删除内容。另外，如果我多次附加一个事件，这有关系吗？例如，在我的选
浏览 2提问于2010-07-06得票数 14
回答已采纳
1回答
选项卡是使用“新建”按钮动态创建的 <ul> <a href="#Untitled-1">Untitled-1<fsm”类的div区域，通过拖动状态机(SM)块并将其放到“fsm”div中，动态绘制状态机。如果有多个选项卡，在fsm div中</
浏览 9提问于2013-07-29得票数 0
回答已采纳
我对jquery ui选项卡有一个问题。我有一个mod重写，它会重写；例如：问题是我有几个jquery ui选项卡，它们阻止了动态数据的加载。我猜这是因为在漂亮的url末尾添加了#tabname，如下所示：如何在url中有或没有#tabname的情况下将动态数据加载到正确的选项卡中。
浏览 0提问于2011-12-19得票数 0
回答已采纳
1回答
我有一个显示页面，它使用JQuery-ui选项卡动态加载基于选项卡选择的内容。：//= require jquery-ui
var $tabs = $("#tabs").}});
现在应该发生<e
浏览 2提问于2012-05-08得票数 0
回答已采纳
当动态添加选项卡和内容时，我无法让jQuery UI选项卡工作。<div id="wrap"></div>var count = 1; $('#wraphref="#page' + count + '">&#
浏览 2提问于2011-04-20得票数 3
回答已采纳
好的,我的对话框是动态的，并且加载了动态内容，包括动态jquery ui选项卡。当我在对话框中使用tab键时，焦点停在第一个选项卡上，不会继续到下一个选项卡。我试图将焦点设置到下一个li a上，我试图模糊keycode.tab上的活动标签，并在标签中添加了不同的tabindex's
浏览 0提问于2012-02-07得票数 0
回答已采纳
1回答
我正在处理一个HTML页面，其中有一个表中的项目列表，在单击一个项目时，会生成一个新的选项卡，显示所单击项目的详细信息。我使用jquery-ui选项卡来动态创建选项卡。这段代码在第一次加载选项卡时有效，问题是我还有一个X按钮来关闭选项卡，在单击该按钮时，我使用jquery .remove()函数从HTML DO
浏览 1提问于2015-09-30得票数 0
1回答
我制作了一个创建jquery ui选项卡的示例，我正在动态创建一个动态表，并在jquery ui选项卡中呈现该表。但它只在最后一个选项卡中显示表格，而不在前两个选项卡中显示。下面是我的代码。tabs-2").append($table);
$("#
浏览 3提问于2011-11-11得票数 0
回答已采纳
2回答
我试着在点击按钮时添加一个动态标签。我成功地完成了它。现在，我希望动态选项卡在创建时自动选中。/ui/1.10.0/themes/base/jquery-ui.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery
浏览 0提问于2013-01-29得票数 5
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
