通过使用 .load() 加载的文件访问已添加到 DOM 的元素答案

【问题标题】：Accessing elements which have been added to the DOM via file loaded using .load()通过使用 .load() 加载的文件访问已添加到 DOM 的元素
【发布时间】：2011-06-19 10:31:32
【问题描述】：

我正在使用 jQuery .load() 加载一个 php 文件。这个 php 文件回显了一个新的 div。这个 div 包含一个属性“title”，我需要在我的 js 文件中获取它的值。

// file.php
echo '<div id="max_page" title="' . $max_page . '"></div>';

// js
$("someElement").load("file.php");
var num = $("div#max_page").attr("title");

这会导致 num = "undefined"。我假设这样做的原因是 div#max_page 在执行初始 $(document).ready 之后被添加到 DOM 中，因此 jQuery 根本不知道它的存在。那正确吗？

如何解决问题？（我尝试过使用 .live() 但无法让它为我工作）

【问题讨论】：

标签： php jquery jquery-load

【解决方案1】：

当您检查num 时，它尚未添加到 DOM，因为 ajax 尚未完成将页面加载到 DOM 中。在load 的complete 回调中执行：

$("someElement").load("file.php",function(){
var num = $("div#max_page").attr("title");
});

【讨论】：

我按照建议做了，现在我实际上得到了属性的值。但是，它仍然很奇怪。我可以调用 var num = ... 行下面的函数吗？
@Ben 函数依赖于要分配的num，没有。您还需要将这些内容放入回调函数中。
我要做的是：obj.totalPages = $("div#max_page").attr("title");显示数字（obj）；那是行不通的。但是，如果我从 displayNumbers() 中获取所有代码并将其复制到回调中，它确实可以工作。有没有办法解决冗余？
如果你在回调中有obj.totalPages = $("div#max_page").attr("title"); displayNumbers(obj);，它应该可以工作。 obj 的其余部分在哪里定义？您能否将脚本中相关代码的完整副本发布到 jsfiddle 或其他内容？
看来是obj的问题。因为如果我将函数 + 调用更改为 displayNumbers(obj, num) 并在函数中使用 num 而不是 obj.totalPages，它确实有效。很混乱。我会尝试找到相关的位。

【解决方案2】：

你认为你的时机不对是对的 :)

// js
$("someElement").load("file.php", function(){
    var num = $("div#max_page").attr("title");
    // here you can do with num whatever you need
});

作为第二个参数传递的函数将在file.php加载到someElement后立即执行，从而保证此时title属性存在。

【讨论】：

【解决方案3】：

当您设置num 时，该文件尚未加载。使用回调。

$("someElement").load("file.php", function () {
   var num = $("div#max_page").attr("title");
});

【讨论】：