Jquery 选项卡和表单
这可能是一个奇怪的问题,但我不确定解决这个问题的最佳方法..
我正在使用 JQuery ajax 选项卡。选项卡部分是动态的,因此可以添加多个选项卡,因为内容是通过 Ajax 加载的,因此可以将相同的内容加载到不同的选项卡中。另一个重要的细节是我正在使用“缓存”选项,以便选项卡保持状态。
现在,当加载多个选项卡时就会出现问题。看起来 HTML 项目(例如表单和 div)现在在 DOM 中具有重复的 id,因此 Ajax 查询无法再区分元素。结果是任何 JavaScript/Ajax 都会中断。
有人对解决此类问题的方法有什么建议吗?
提前致谢..
this may be a weird problem but I’m not sure the best way to go about it..
I am using JQuery ajax tabs. The tab section is dynamic so multiple tabs can be added, as the content is loaded via Ajax the same content can be loaded into different tabs. The other important detail is that i am using the Cache option so the tabs maintain state.
Now problems arise when more than one tab has been loaded. It looks like HTML items such as forms and divs now have duplicated id's within the DOM, so Ajax queries can no longer distinguish between the elements.. The result is that any JavaScript/Ajax breaks.
Does anyone have any suggestions for way to tackle such a problem?
Thanks in advance..
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
当 ajax 调用发出并返回时,您可以在加载到选项卡之前获取 HTML 并修改新选项卡内容的 id。这将允许您拥有如下 ID:
tab1input1
tab1input2
tab2input1
tab2input2
已编辑
在 Jquerys 站点的演示中 http://jqueryui.com/demos/tabs/#ajax 这里的源代码显示以下内容,
您应该注意,您可以使用选项卡控件设置特定的ajax选项。请参阅 jquery 文档中有关 $.ajax 的文档。另一个选项是 success,它允许您在 ajax 调用成功后运行函数。
使用 success 选项,您可以
进行 ajax 调用,返回 HTML 并修改 html 中的输入 ID 和名称,并将 tabid 附加到新数据中。
When the ajax call is made and returns, you can get the HTML and modify the id's of the new tab contents before you load into the tab. This would allow you to have IDs like:
tab1input1
tab1input2
tab2input1
tab2input2
Edited
In the demo on Jquerys Site http://jqueryui.com/demos/tabs/#ajax the source code here displays the following
you should notiec that you can set specific ajax options with the tab control. Refer to documentation on $.ajax in jquery's documentation. Another option is success which allows you to run a function after the ajax call was successful.
Using the success option you can
this should take an ajax call that returns HTML and modify the input ids and names in the html and append the tabid to your new data.