javascript - 找不到用 php 添加的元素或元素 id

Question

使用 jquery，我向 div 元素添加新元素，我还设置了新添加元素的 id，但 javascript 仍然找不到新添加的元素。

$.ajax({  //ajax call
    type: "POST",       
    url: "ajax/ajax.php", 
    data: { users: values }
}).done(function( msg ) {
    //do something with msg which is response
    //this line will put the response to item with id `#txtHint`.
    $("#divselect").html(msg)
    //alert(msg);
});
});

新元素添加成功，但单击按钮时 JavaScript 找不到该新元素 ID。有什么方法可以只重新加载 javascript 或者我应该做什么？

     $("#validator").click(function (){//validator is my submit button id

     var value = document.getElementById('select_division'); //select_division is id of my new added element
     alert(value);
 }

然后出现引用错误。关于这一点。

Answer 1

jQuery 仅在运行时识别页面中的元素，因此 jQuery 无法识别添加到 DOM 的新元素。要解决这个问题，请使用 event delegation ，从新添加的项目到 DOM 中某个点的冒泡事件，该点在 jQuery 在页面加载时运行时就在那里。许多人使用 document 作为捕获冒泡事件的地方，但没有必要一直沿着 DOM 树向上走。理想情况下you should delegate to the nearest parent existing at the time of page load.

此外，ID's Must Be Unique ，特别是因为它会导致 JavaScript 出现问题当您尝试与这些元素交互时，还可以使用 CSS。

将您的选择器(从 jQuery 切换到普通 JS 确实没有必要，因为您已经在使用 jQuery)更改为类并使用 on() 执行事件委托(delegate):

$(document).on('click', '.validator', (function (){//validator is my submit button id
    var value = document.getElementsByClassName('select_division'); //select_division is id of my new added element
    alert(value);
})

这里的部分问题是您需要一个与您的验证器相关的特定select_division。为了得到这个，你可以执行一些 DOM 遍历。如果没有看到您的标记，我无法告诉您如何进行遍历。