jquery - 如何在带有请求参数的页面上使用 jQuery UI 选项卡

Question

我有一个页面，当没有参数时显示一个表格。但是如果传递了一个参数，它会显示一个用于编辑的表单。我在这里尝试使用 jquery 选项卡，但它会将整个页面与表格一起加载到选项卡内容应该位于的位置。

html:

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Edit Product</a></li>
        <li><a href="#tabs-2">Images</a></li>
    </ul>
    <div id="tabs-1">
        <strong>Form goes here</strong>
    </div>
    <div id="tabs-2">
        <strong>Edit images here</strong>
    </div>
</div>

运行前截图$('#tabs').tabs()：

之后的截图：

Answer 1

对我来说，这听起来更像是一个后端问题。服务器应该只给你一个部分文件而不是整个站点，以减少带宽使用。这不是真正的 jquery 问题，而是您如何处理请求服务器端的问题。

给它一些参数，如 partial=true 或检查它是否通过 AJAX 请求调用，然后只传递部分文件。

Answer 2

问题出在 Joomla 包含的 MooTools 中。虽然我没有使用任何 mootools 函数，但它以某种方式被 jQuery 的“加载”事件触发。我决定不使用标签，因为我找不到解决方案。但是当我对图像使用模态弹出窗口时，我遇到了同样的问题。（通过开发人员工具上的网络选项卡进行调试，发现 MooTools 是罪魁祸首。）只需将其删除即可解决问题。