Question

我使用jquery选项卡作为示例
我有一个index.php

<div id="content"></div>

和custom.js：仅在导航点击后加载page.php ，默认情况下#content为空

$(function() { $('#tabs').tabs(); }); // clicked event below $('#content').load(page.php) // load only when clicked

page.php：page.php加载成功，但页面内的标签显示不正确，所有功能都无法正常工作，因为即时通讯使用.load（）

<div id="tabs"> tabs data etc.. </div>

所以我的问题是：
1.有没有办法在使用.load（）函数后重新加载custom.js（文件）？或
2.有没有办法在page.php上没有将一堆jquery代码写入script标签？或
3.有没有更好的办法呢？

Answer 1

目前，当页面已满载时，您正在初始化jquery选项卡（但由于您在加载页面后通过ajax加载内容，因此您的html不可用），因此您必须在页面上呈现html后初始化jquery选项卡插件通过加载调用，您必须使用加载成功回调：

$('#content').load("page.php",function(){

   $('#tabs').tabs();

});

Answer 2

您可以在加载回调中触发事件，并在文档就绪中侦听它。

$(function(){
    $(document).on('ContentsLoadedEvent', function(){
        $('#tabs').tabs();
    });
});

$('#contents').load('http://localhost/page.php', function() {
    $(document).trigger($.Event('ContentsLoadedEvent'));
});

使用load（）jquery后，内部函数无法正常工作

2 个答案: