jquery工具：在ajax加载的脚本中调用docready初始化

Question

我有一个基于 jquery 工具的选项卡工作得很好，并且在每个选项卡上我使用 ajax 加载页面。其中一个页面已经从另一方获得了工具，这需要在准备好时运行以下代码：

$(function() { $('.scroll-pane').jScrollPane({showArrows: true}); });

我注意到该代码应该放在哪里（在ajax加载的页面中）。根据 flowplayer 的说法：

“脚本标签应该放置在 HTML 元素下方，而不是放置在 document.ready() 事件中，因为使用 AJAX 加载的页面不会触发该事件。”

这是否意味着将上述内容封装在 标记中，并放置在 标记之后？这在整个文档之外，所以看起来不正确...

帮助任何人...我应该将我的初始化代码放在 ajax 文档中的哪里？

谢谢

Answer 1

将其作为 AJAX 加载的回调运行，这样代码将在 HTML 加载到 DOM 后运行。

$('#result').load('ajax/test.html', function() {
  $(function() { $('.scroll-pane').jScrollPane({showArrows: true}); });
});

请在 load() 的 API 中了解更多信息。

Answer 2

这是一个不太可能的事情，但我很确定您可以利用 onClick 事件。我相信这是在标签内容加载后触发的，即使是通过 AJAX 也是如此。您可以写这样的内容：

$("ul.tabs").tabs("div.panes > div", {
    effect: 'ajax',
    onClick: function(event, index) {
        $('.scroll-pane').jScrollPane({showArrows: true});
    }
});

我希望这对您有用。如果确实如此，则严重无证。

Answer 3

如果我正确理解您的问题，将有两种方法来解决此问题。

a) 在选项卡加载之前加载脚本，因此您不应该等待脚本加载

b) 将脚本动态加载到主页并调用回调，

以防 b 您应该这样做：

 function loadScript(sScriptSrc, oCallback) {
    var oHead = document.getElementById('head')[0];
    var oScript = document.createElement('script');
    oScript.type = 'text/javascript';
    oScript.src = sScriptSrc;
    // most browsers
    oScript.onload = oCallback;
    // IE 6 & 7
    oScript.onreadystatechange = function() {
        if (this.readyState == 'complete') {
            oCallback();
        }
    }
    oHead.appendChild(oScript);
}

对我来说，它的结构问题，不是脚本问题。这意味着，何时/如何/何处选项卡数据和脚本在 ajax 调用上加载。更好的方法是如果您分享发生这种情况的演示链接。我很乐意提供帮助。

如果我理解您的问题，请告诉我