如何指定使用jQuery

我有一个div，其内容会从innerHTML的动态生成，我似乎无法针对使用jQuery进行验证这些元素从innerHTML的或.html（）设置元素，例如，这是网页：如何指定使用jQuery

<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US"> 
<head> 
</head> 
<body> 
<span id="alert1">Alert1</span> 
<input type="button" value="Click Me" id="button1" /> 
<div id="empty"></div> 
</body> 
</html>

，这是js代码：

<script type = "text/javascript"> 
    $(document).ready(function() { 
     $('#button1').click(function() { 
      var html = "uname <input type='text' id='uname'><br />password <input type='text' id='password'><br /><span id='alert'>Alert</span>"; 
      $('#empty').html(html); 
     }); 
     $('#alert').click(function() { 
      alert('Alert'); 
     }); 
     $('#alert1').click(function() { 
      alert('Alert1'); 
     }); 
    }); 
</script>

与ID alert1的作品跨度但ID警报的警报，其使用的innerHTML或.html（）不工作，那么如何解决这一问题设定？

预先感谢您

来源

2012-07-30 Subash

的这里的问题是，当你写这样的..

$("#element").click(function() { 
     alert("Alert!"); 
    });

..它只会造成当你执行的代码中存在的元素的事件处理程序。即使它们具有相同的jQuery选择器（本例中为“#element”），它也不会为将来的元素创建事件处理程序。

您需要做的事情是在父元素上绑定.on(event, selector, function)，因为事件会“向上冒泡”层次结构。这样你可以处理来自指定选择器的未来事件。个人而言，我会做这样的：

$(document).ready(function() { 
    $('#button1').click(function() { 
     var html = "<insert lots of html stuff here>"; 
     $('#empty').html(html); 
    }); 

    $(document).on("click", "#alert", function() { 
     alert("Alert!"); 
    }); 

    $(document).on("click", "#alert1", function() { 
     alert("Alert1!"); 
    }); 
});

来源

2012-07-30 07:10:48

使用.on()代替.click()绑定在运行时的事件。您可以尝试.live()，但不推荐使用。

这里的小提琴：http://jsfiddle.net/Akyrk/

来源

2012-07-30 07:05:22 Vishal

你必须附上听众AFTHER您添加的对象到DOM！

所以afther .html(...)

<script type = "text/javascript"> 
$(document).ready(function() { 
    $('#button1').click(function() { 
     var html = "uname <input type='text' id='uname'><br />password <input type='text' id='password'><br /><span id='alert'>Alert</span>"; 
     $('#empty').html(html); 
     $('#alert').click(function() { 
      alert('Alert'); 
     }); 
    }); 

});

.on()也是一种选择。如果将侦听器呈现给dom，则独立绑定侦听器。但我推荐第一种方法。如果您正在编写更大的应用程序，创建后附加处理程序的方法会更清晰，那么事件委托自动附加事件处理程序可能甚至不会发现。 1或2个是好的，但如果您要添加多个事件，多个对象（变量，类），你可以失去监督......

来源

2012-07-30 07:06:26 VDP

使用事件委托绑定单击处理程序，使用.on()这

 $('#empty').on('click', '#alert1', function() { 
     alert('Alert1'); 
    });

或者您可以在创建内容后绑定处理程序。

来源

2012-07-30 07:08:30 Musa

你应该使用委托

$(elements).delegate(selector, events, data, handler);

按你的代码

$(document).ready(function() { 
    $("yourdiv").delegate("#alert, #button, #Alert1", "click", function() { 
    alert('Alert'); 
    }); 
});

来源

2012-07-30 07:14:33

如何指定使用jQuery

回答

相关问题