javascript - jQuery - 如何访问 Ajax 调用显示的对象？

Question

我有一个由 jQuery .load() 函数加载的内容：

<input type="text" name="street2" id="street2" value="" class="text" />

我有一个简单的 jQuery 处理程序，可以将值添加到焦点上的输入标记中：

jQuery( function( $ ) {
    $( "#street2" ).focus(function(){
        $( "#street2" ).val($( "#address" ).val());
    });
});

当对象#street2 不存在时，JS 代码在第一次加载时与其他脚本一起加载。因此它没有用。

我尝试在执行 Ajax 后直接用不同的方式加载脚本，但没有成功。你能建议我如何用 jQuery 处理新对象吗？

提前致谢

score 0 · Accepted Answer

您是否尝试过事件委托（“为现在和将来匹配当前选择器的所有元素附加事件处理程序”）？

$(document).on('focus', '#street2', function(){
    $('#street2').val($('#address').val());
});

带事件委托：http: //jsfiddle.net/8HHTM/

没有（如您当前的代码）：http: //jsfiddle.net/8HHTM/1/

score 0 · Accepted Answer

当 dom 准备好时，jQuery 将焦点事件绑定到与选择器“#street”匹配的所有元素。但是，当 dom 准备好时，ajax 调用尚未完成，因此没有任何元素与您的选择器匹配。

要确保事件绑定到选择器的所有实例（以及未来尚未添加到 DOM 的实例），请使用on()函数：

$(document).on(events, selector, data, handler);

2 回答 2