我有一段代码，我循环浏览页面上的所有选择框，并将一个悬停事件绑定到它们上，以便在鼠标打开/关闭时对它们的宽度进行一些微调。
这在页面就绪时发生，工作正常。
我遇到的问题是，在初始循环之后通过Ajax或DOM添加的任何选择框都不会绑定事件。
我已经找到了这个插件（jQuery Live Query插件），但在我用插件向我的页面添加另一个5k之前，我想看看是否有人知道这样做的方法，无论是直接使用jQuery还是通过另一个选项。
当前回答
我更喜欢以模块化函数的方式部署事件侦听器，而不是编写文档级事件侦听器的脚本。所以，我喜欢下面。注意，您不能使用同一个事件侦听器超额订阅某个元素，因此不要担心多次附加侦听器-只需一个侦听器。
var迭代=4；var按钮；var body=document.querySelector（“body”）；for（var i=0；i<迭代次数；i++）{button=document.createElement（“button”）；button.classList.add（“我的按钮”）；button.appendChild（document.createTextNode（i））；button.addEventListener（“单击”，myButtonWasClicked）；body.appendChild（按钮）；}函数myButtonWasClicked（e）{console.log（e.target）//访问此特定按钮}
其他回答
您可以使用live（）方法将元素（甚至是新创建的元素）绑定到事件和处理程序，如onclick事件。
下面是我编写的示例代码，您可以看到live（）方法如何将所选元素，甚至是新创建的元素绑定到事件：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.16/jquery-ui.min.js"></script>
<input type="button" id="theButton" value="Click" />
<script type="text/javascript">
$(document).ready(function()
{
$('.FOO').live("click", function (){alert("It Works!")});
var $dialog = $('<div></div>').html('<div id="container"><input type ="button" id="CUSTOM" value="click"/>This dialog will show every time!</div>').dialog({
autoOpen: false,
tite: 'Basic Dialog'
});
$('#theButton').click(function()
{
$dialog.dialog('open');
return('false');
});
$('#CUSTOM').click(function(){
//$('#container').append('<input type="button" value="clickmee" class="FOO" /></br>');
var button = document.createElement("input");
button.setAttribute('class','FOO');
button.setAttribute('type','button');
button.setAttribute('value','CLICKMEE');
$('#container').append(button);
});
/* $('#FOO').click(function(){
alert("It Works!");
}); */
});
</script>
</body>
</html>
我更喜欢以模块化函数的方式部署事件侦听器，而不是编写文档级事件侦听器的脚本。所以，我喜欢下面。注意，您不能使用同一个事件侦听器超额订阅某个元素，因此不要担心多次附加侦听器-只需一个侦听器。
var迭代=4；var按钮；var body=document.querySelector（“body”）；for（var i=0；i<迭代次数；i++）{button=document.createElement（“button”）；button.classList.add（“我的按钮”）；button.appendChild（document.createTextNode（i））；button.addEventListener（“单击”，myButtonWasClicked）；body.appendChild（按钮）；}函数myButtonWasClicked（e）{console.log（e.target）//访问此特定按钮}
另一种解决方案是在创建元素时添加侦听器。不是将监听器放在主体中，而是在创建元素的瞬间将监听器放入元素中：
var myElement = $('<button/>', {
text: 'Go to Google!'
});
myElement.bind( 'click', goToGoogle);
myElement.append('body');
function goToGoogle(event){
window.location.replace("http://www.google.com");
}
使用jQuery的.on（）方法http://api.jquery.com/on/将事件处理程序附加到活动元素。
从1.9版起，live（）方法也被删除。
我更喜欢使用选择器，并将其应用于文档。
这将自身绑定到文档上，并将适用于页面加载后呈现的元素。
例如：
$(document).on("click", 'selector', function() {
// Your code here
});
