Question

我正在通过jquery.ajax加载外部页面：

$("#mydiv").load("filter.html");

example.html的内容：

<div id="filterdiv"><input id="filter" name="filter" size="40"/></div>

然后我想操纵输入#filter，所以我用javascript编写：

$('#filterdiv input').focus(function(){
    alert(Hello);
}

没有任何反应。如果我将filter.html的代码直接粘贴到页面上，它可以正常工作，但是当我通过ajax调用它时，

$('#filterdiv input').focus(function(){
    alert(Hello);
}

没有看到ajax加载的内容。我为什么做错了？我怎样才能操纵ajax加载的html？

Answer 1

您需要在加载html后添加事件处理程序。另请注意，我引用了警报参数（不确定问题是否确实存在问题或错误）。

$("#mydiv").load("filter.html", null, function() {
   $("#filterDiv input").focus( function() {
      alert('Hello');
   });
});

如果您正在使用live方法可以处理的事件之一，那么您可以使用它在页面的整个生命周期内设置一次处理程序。不幸的是焦点事件不是其中之一。

在jQuery 1.3中添加：绑定处理程序   为所有人举办活动（如点击）   当前 - 和未来 - 匹配   元件。也可以绑定自定义事件。

可能的事件值：点击，   dblclick，mousedown，mouseup，   mousemove，mouseover，mouseout，   keydown，keypress，keyup

目前   不支持：模糊，焦点，   mouseenter，mouseleave，change，submit

Answer 2

您需要在加载AJAX页面后应用操作。这可能意味着将其添加到AJAX页面的末尾。或者在回调函数上。

$("#mydiv").load("filter.html", null, function(){ $('#filterdiv input').focus(function(){
    alert("Hello");
} });

与服务器端编程页面不同，即使页面当前正在提取，浏览器仍将继续执行下一行代码。如果在下一行绑定某些内容（如单击），则可能未加载该页面，因此不会绑定该页面。

另一方面，回调函数仅在实际加载AJAX页面时执行。

如何操纵ajax加载的内容？

2 个答案: