【问题标题】:jquery, loading a page while page is not fully loadedjquery,在页面未完全加载时加载页面
【发布时间】:2016-06-10 00:10:49
【问题描述】:

我有一个包含这一行的 JavaScript 文件:

$('.item').load('page'); // (tried with document ready)

它不起作用。看起来该行在页面完全加载之前执行(因为它在我在控制台中键入同一行时有效)。

【问题讨论】:

  • 这里有问题吗?
  • 除非选择器匹配具有“item”类的元素,否则不会加载任何内容。您确定页面最初加载时存在具有类项的元素并且之后没有通过代码添加吗?这对我来说听起来像是一个时间问题。也许添加一些 console.write($('.item').length) 代码来查看它是否存在
  • 我重复一遍,当我输入同一行代码来控制台时,它可以工作。当我尝试检查.length时,它在控制台中显示为零:)
  • 我们无法告诉您为什么它会在 DOM 加载之前执行,因为您没有向我们展示您是如何调用它或如何构建 DOM 的。 .item 是由于 setTimeout 5 秒后执行而动态创建的吗?我不知道,因为我看不到代码。
  • 您发布的代码没有问题,所以如果它不起作用,您需要发布更多代码。

标签: javascript jquery ajax jquery-load


【解决方案1】:

您需要验证几个条件。相对于使用此加载功能的页面,文档的路径(包括文件扩展名)需要正确。您尝试加载的元素需要存在。

您的控制台是否出现错误?它说什么?

这绝对有效。

<body>
    <div class="item"></div>
    <script src="https://code.jquery.com/jquery-2.2.1.min.js"></script>
    <script>
        $(document).ready(function() {
            $('.item').load('page.html');
        });
    </script>
</body>

【讨论】:

  • 好吧..我的项目有点复杂:))
  • 不幸的是,您的示例并不复杂 - 也许您可以在原始问题中添加更多细节,包括来自控制台或网络日志的错误消息。
  • 显然某些复杂性是问题的原因。不幸的是,您没有在此处包含任何复杂性,因此我们无法轻松调试我们看不到的内容...
【解决方案2】:

 $('document').ready(function(){
        $('.item').load('page');
     });

你需要在页面准备好时调用它。

【讨论】:

    【解决方案3】:

    您是否尝试过等到窗口加载完毕?:

    $(window).load(function(){
        $('.item').load('page'); 
    });
    

    【讨论】:

    • 你有我们可以看到的 JSFiddle 或现场示例吗?
    最近更新 更多