Question

我有一个html文件

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

然后我用js动态更改内容

$.get("foo.html", function(data){
    $("#content").html(data);
});

foo.html是一个外观的html文件，看起来像这样

<span id="results">
</span>

这可以改变我的页面内容。我已经检查了Chrome的开发工具，现在页面看起来像这样

<body>
    <div id="content">
        <span id="results">
        </span>
    </div>
</body>

大。现在我想用jQuery显示一些结果

$("#results").text("some text");

这最后一部分不起作用。我只能假设它是因为#results是动态创建的。我知道事件处理程序的这个问题并且使用on而不是click，但这不是这里的情况。我只是想选择元素。

当然我的实际代码要复杂得多，而且我留下了一些东西。如果您认为还有其他可能导致问题的原因，请告诉我，我会检查。

Answer 1

$ .get是一个异步函数，这意味着它在继续之前不会等待完成。 jQuery如何解决这个问题的方法是使用回调函数。在这里，我们定义了一个回调函数。我们需要将文本修改放在$ .get回调中。

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

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
$.get("foo.html", function(data){ //$.get callback function(data)
    $("#content").html(data);
    $("#results").text("some text");
});
</script>

Answer 2

您的结束标记</span应为</span>
当您对其进行操作时，请确保页面上存在<span id="results">。因为您正在动态加载内容，所以存在竞争条件，因此在加载后对其进行操作：
```
$.get(…).done(function(){
   $('#results').text('foo')
});
```

除此之外，还需要显示更多信息，可能是小提琴或代码片段。

我无法选择使用jquery

2 个答案: