为什么在jquery中添加新选项卡时没有内容？
为什么在jquery中添加新选项卡时没有内容？
提问于 2012-07-19 16:23:53
首先，我用下面的代码创建了一个选项卡：
<div id="statsTabs" style="width:100%; height:100%">
<ul>
<li><a href="#f-campaign"><span>广告系列</span></a></li>
<li><a href="#f-adgroup"><span>广告组</span></a></li>
</ul>
</div>
<div id="f-campaign">...</div>
<div id="f-adgroup">...</div>
<script>
$(document).ready(function() {
$("#statsTabs").tabs();
});
</script>每件事都运行得很好，但当我尝试下面的代码时，我得到了一些问题：
$("#statsTabs").tabs( "remove" , 0);
$("#statsTabs").tabs("add", '#f-campaign', "广告系列" , 0);出现一个带有"广告系列“标签的新选项卡，但其中没有内容，这是为什么？因为第一个代码段获取了#f-campaign的内容。
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-07-19 16:39:21
这个：$("#statsTabs").tabs( "remove" , 0);还删除了li和相关的div，因此当您再次添加选项卡时，它没有任何内容，正如预期的那样。
Stack Overflow用户
发布于 2012-07-19 16:26:04
当您调用Remove函数时，它会删除选项卡和内容。
这就是你不能再添加它的原因。您需要重新构建它才能做到这一点。
我在JS中使用了一个console.log()来演示这一点：http://jsfiddle.net/Allan/2YcBh/
您可以像这样使用回调函数来避免这种情况：
$(document).ready(function() {
$("#statsTabs").tabs({
remove: function(event, ui) {
// Back up the content here, or simply move the tab so that you can add it again later.
}
});
$('input').click(function() {
$("#statsTabs").tabs( "remove" , 0);
console.log($('#f-campaign'));
$("#statsTabs").tabs("add", '#f-campaign', "广告系列" , 0);
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/11556765
复制相关文章
相似问题
腾讯云开发者
