jQuery ui-tabs 在页面加载后加载
我需要在 DOM 加载后创建一些选项卡。我使用 jQuery 的附加创建必要的标记,然后创建选项卡,但它们不起作用。按应有的方式应用样式,显示选项卡,但所有选项卡内容都会立即显示,并且单击时选项卡不执行任何操作。选项卡是否必须以某种特定方式初始化?
代码如下:
$(".edit-element").livequery(function() {
$(".edit-element").click(
function() {
//alert("Clicked");
var id=$(this).parent().attr('id');
$(this).parent().append("<div id=\""+id+"_tabs\"><ul>
<li><a href=\""+id+"_tab0\">Nunc tincidunt</a></li>
<li><a href=\""+id+"_tab1\">Nunc tincidunt</a></li></ul>
<div id=\""+id+"_tab0\">Proin elit</div>
<div id=\""+id+"_tab1\">Proin elit arcu, rutrum commodo</div></div>");
$(this).remove();
$("#"+id+"_tabs").tabs();
}
);
});
livequery()
就在那里,因为我通过 Ajax 远程加载这些元素。
I need to create some tabs after the DOM has loaded. I create the neccessary markup using jQuery's append, and then create the tabs, but they are not working. The style is applied as it should, the tabs are shown, but all of the tab content is displayed immediately, and the tabs do nothing, when clicked upon. Do the tabs have to be initialized in some specific way?
Here's the code:
$(".edit-element").livequery(function() {
$(".edit-element").click(
function() {
//alert("Clicked");
var id=$(this).parent().attr('id');
$(this).parent().append("<div id=\""+id+"_tabs\"><ul>
<li><a href=\""+id+"_tab0\">Nunc tincidunt</a></li>
<li><a href=\""+id+"_tab1\">Nunc tincidunt</a></li></ul>
<div id=\""+id+"_tab0\">Proin elit</div>
<div id=\""+id+"_tab1\">Proin elit arcu, rutrum commodo</div></div>");
$(this).remove();
$("#"+id+"_tabs").tabs();
}
);
});
The livequery()
is there, because I'm loading those elements remotely, via Ajax.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
我自己找到了答案。
我忘记了链接中 div 名称之前的
#
符号。所以,它应该就
这么简单。
感谢所有提供帮助的人!
I found the answer myself.
I had forgotten the
#
sign before the div name in the link i have. So, instead ofit should have been
As simple as that.
Thanks for everyone that provided help!
您的选项卡可能无法工作,因为您正在为该页面上已存在的选项卡指定 id。页面上的 id 应始终是唯一的(即,您不能在同一页面上多次使用相同的 id)
下面的两行代码表明您正在为选项卡分配与其父级相同的 id,因此它可能无法按预期工作当点击时。
Your tabs might not work because you are asigining id to tabs which already exists on that page. The id on the page should always be unique (ie you cannot use same id more then once on same page)
The below two code lines of yours indicate that you are assigning the tabs same id as it's parent and hence it might not work as expected when clicked.