无法尝试使用jQueryUI动态加载的Ajax选项卡执行jQuery代码

Question

您好
我在index.php文件中使用jQueryUI选项卡 我有4个标签和4个文件。我使用jQueryUI Tabs Ajax功能

加载每个选项卡内容

每个文件都有自己的jQuery插件和代码，但是我的问题是当我在Contact选项卡中加载（例如）contact.php时，contact.php中的jQuery代码无效或触发< /强>

我见过 .ajaxComplete（） 函数，但它是“脏”的，因为它迫使我从每个代码中移回所有代码将文件发送到index.php文件，我的观点是将代码分开并使所有内容更加干净。

此外，谷歌地图在jQueryUI标签中动态加载时不起作用...

Answer 1

根据http://docs.jquery.com

任何需要进行初始化计算以进行初始化的组件都不能在隐藏选项卡中工作，因为选项卡面板本身是通过display：none隐藏的，因此内部的任何元素都不会报告它们的实际宽度和高度（0 in大多数浏览器）。

有一个简单的解决方法。使用左侧技术隐藏非活动选项卡面板。例如。在样式表中用

替换类选择器“.ui-tabs .ui-tabs-hide”的规则

.ui-tabs .ui-tabs-hide {
    position: absolute;
    left: -10000px;
}

对于Google地图，您也可以在显示标签后调整地图大小：

$('#example').bind('tabsshow', function(event, ui) {
    if (ui.panel.id == "map-tab") {
        resizeMap();
}
});

resizeMap（）将在特定地图上调用Google Maps的checkResize（）。