jQuery .load（）不加载插件

我有一个包含2个链接的主页，通过.load（）加载外部文件。第一个文件有一个简单的JavaScript翻转，当内容被加载时工作。第二个文件有一个jQuery插件，当通过.load（）加载时不起作用 - 但在数据文件被自己查看时工作正常。jQuery .load（）不加载插件

主文件：http://gator1105.hostgator.com/~carc/test-load.html通过自身工作

第二个数据文件，但不能从.load（）（如上相同的URL，但该文件是测试负载two.html - StackOverflow上会允许我创建只有1个超链接）而不是粘贴我的源代码在这里，你可以从页面本身查看它。

如何在载入.load（）时获得第二个幻灯片放映文件？

来源

2010-03-04 jac

忽略这个答案

你的第二个文件执行其初始化一个“的document.ready”块。当您的内容通过AJAX加载时，这不会运行。尝试将第二页中的代码放在“document.ready”中，这样它就是一个纯粹的脚本块。

哦，我看到了 - 不仅是“document.ready”块内的脚本（当然不是了），但第二页是一个完整的HTML文档。您无法将完整的HTML文档加载到另一个文档的中间，它没有任何意义，jQuery只会抓住正文中的内容。因此，请尝试将您的脚本标记移动到身体中，看看会发生什么。（你还是不想要“document.ready”，我不这么认为。）

[edit again]实际上我回过头来 - 我不认为jQuery去掉任何东西;我只是打赌浏览器变得困惑。

[edit yet again]好的，好吧，我看到你已经改变了它 - 让我采取一个非常接近的样子。

来源

2010-03-04 16:08:58 Pointy

我删除了document.ready块，它仍然失败。 – jac 2010-03-04 16:12:18

我更新了答案。 – Pointy 2010-03-04 16:16:37

不好。我改变了主要文档，只是在＃content-area div（不是整个HTML文件）中引入并移动了该div内的脚本。仍然失败。 – jac 2010-03-04 16:22:48

这是因为.load只是加载并设置HTML到你说的元素和脚本标签外所有这

来源

2010-03-04 16:29:44 ElAlecs

不，他把脚本移到了结果的主体中。 jQuery“html（）”函数的作用方式是它去掉脚本元素，在更新DOM时保留它们，然后运行脚本。 – Pointy 2010-03-04 16:39:15

我认为你错了，jQuery只拿你需要的部分，所以，脚本已经出来，不是进程 – ElAlecs 2010-03-04 17:45:23

你是对的 - 当你在URL之后给load（）一个选择器时，脚本不会被执行。当你**不提供选择器时，然而，脚本**被**执行。这对API来说是一种奇怪的方式，我认为这是一种错误。 – Pointy 2010-03-04 18:31:25

确定这里有一个更好的答案：对于原因，我不明白，当你加载一个片段（或一整页;无论）使用特殊的“选择器”特技到挖出仅有文档的一部分与jQuery：从内容

var showThisContent = this.id; 
$('#content').load('test-load-' + showThisContent + '.html #content-area');

jQuery库带出脚本完全 ，并且永远不会运行它们。为什么？我不知道。我知道你可能不再信任我，但这是我对你的源代码所做的事情：我拿了第二个文件（test-load-two）并且删除了头部和东西;基本上我把它做成只包含“内容区域”的片段。（我也摆脱了加载jquery的脚本标记，因为你并不真的需要这样做，因为外部页面已经拥有它了。）然后我改变了主页面（test-load），这样当它调用“load”时只需传入网址而没有即'＃content-area'选择器。这样可行。

[编辑]我刚刚发布了jQuery论坛中发帖提问：http://forum.jquery.com/topic/the-load-function-and-script-blocks

来源

2010-03-04 16:59:33 Pointy

工作。 http://gator1105.hostgator.com/~carc/test-load.html谢谢！ – jac 2010-03-04 18:02:12

没问题。对不起，最初导致你误入歧途。我用过“load（）”，但我从来没有注意到这个特殊的古怪。看起来像是一个bug，特别是因为这个小细节没有记录。 – Pointy 2010-03-04 18:29:58

我实际上可以做了与我工作的网站类似的东西。你要做的是为主页上的$ .load（）调用的每个页面创建一个回调函数。

请看下面的代码从the jquery.load() documenation：

$('#result').load('ajax/test.html', function() { 
    alert('Load was performed.'); 
});

你的具体情况，你会希望这样的事情主要测试load.html页面上。

$(document).ready(
    function(){ 
    $('li').click(function(){ 
     var showThisContent = this.id; 
     $('#content').load('test-load-'+showThisContent+'.html', function(){ 
       if (showThisContent == "one"){ 
        //Do logic for test-load-one.html 

        //Pre-load your images here. 

        //You may have to assign a class to your anchor tag 
        //and do something like: 
        $('a.assignedClass').mouseover(function(){}); 
        $('a.assignedClass').mouseout(function(){}); 
       } //end if 
       if (showThisContent =="two"){ 
        //Do logic for test-load-two.html here 
        $('.slideshow').cycle({ 
         fx: 'fade', 
         speed: 500, 
         timeout: 0, 
         next: '.nextSSimg', 
         prev: '.prevSSimg', 
         pager: '#SSnav', 
         cleartype: true, 
         cleartypeNoBg: true 
        }); //end .cycle() 
       } //end if 
      ); //end .load(location, callback function()) 
    }); //end $('li).click() 
}); //end $(document).ready()

现在，很明显，我没有转换的所有代码，但这里发生了什么是一旦的document.ready完成后，回调函数就会运行，因为像“的元素.slideshow”现在加载进入DOM，您的回调代码将适当地绑定到它们。你可以用几种方式切换这段代码，使其具有相同的结果（即，将2个$ .load（）包装进条件中，而不是在.load回调中执行条件逻辑，和/或将一个callbackOne ）和callbackTwo（）函数上面的document.ready，然后适当调用它们），但这是你的偏好。您应该能够使用$ .load（）的回调函数参数来执行您想要的操作。

来源

2010-06-24 16:52:37 JustinP8

不要去$.load。相反，尝试$.get，这看起来可能不太舒服，但它在另一种情况下适用于我。示例代码如下。

$(li).click(function() { 
    // your code for finding the id 
    $.get('test-load-' + id + '.html', function(responseHtml){ 
     $('div#content-area').empty().append($(responseHtml)); // remove all elements from #content-area 
     // $('...').html(responseHtml) will not work 
    }); 
});

我希望这可以解决您的问题。

来源

2010-07-27 12:32:25 Daniel

jQuery .load（）不加载插件

回答

相关问题