javascript - 事件监听器不适用于附加项目

Question

嘿，我在单击时将一个表单附加到页面上，该表单有一些文本框，我需要添加事件监听器，例如在按键上，但该功能不工作，不知道问题出在哪里，该功能在任何地方都可以正常工作，但不适用于此表格是代码。

附加表格

 function activityCHART(thisobj){
 var theidis=$(thisobj).attr("id");
  $("#FULL_FADE").fadeIn();
      $.ajax({
  type: 'post',
    url: 'newpage.php',
  data:{'actde':theidis},
    success: function(dataa){
   $("#the_APPEDEDr5").empty().append(dataa);
  }});}

新页面存在此文本框以及更多文本区域

<input type="text" name="deptname" placeholder="department name" id="detp_names09o" class="TEXTNAME_o909ioi"/>

添加此事件监听器

 $('#detp_names09o').keypress(function (e) {
alert('ok');});

这些是一些脚本链接

 src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

我认为存在一些脚本链接问题

当我这样做时就会发出警报 onkeyup="thisisfun();"函数 thisisfun(){ 警报('确定'); }

Answer 1

您应该使用 live()、delegate() 或 on() 将事件监听器附加到动态添加的 DOM 元素。 bind() 和 keypress() 不适用于动态添加到 DOM 的元素[参见 this]

$('#detp_names09o').live("keypress",function (e) {
      //do some stuff
});

.on() 主要是可以模仿 .live() 或 .delegate() 的语法糖，具体取决于您如何调用它。

$('#detp_names09o').on("keypress",function (e) {
      //do some stuff
 });

此外，您还指定了两个不同版本的 jQuery。尽管 CDN 确实比本地引用的库有一些优势，但它们有时可能会破坏您的代码。如果这就是您引用本地 jQuery 文件(以及 CDN 版本)的原因，您可以考虑查看 CDN fallbacks 。无论哪种情况，您都应该小心您使用的版本。

干杯!