如果尚未添加HTML元素，则Jquery .click（）不起作用

Question

我试过方法： Attaching click event to a JQuery object not yet added to the DOM

但似乎在我的情况下不起作用。在我dom创建jquery个元素后，无法访问新创建的元素。我想要的是点击"click me"按钮后，图片会显示，我希望点击图片并显示div (#color-picker-box)。

我的代码：https://codepen.io/MoMoWongHK/pen/ZXbWYb

Answer 1

在调用div的id时添加数字符号＃，

来自

SELECT COUNT(DPlace) as CountTotal
FROM tblTest2
WHERE DSide=1 
  AND DNumber LIKE '[0-9]0[0-9]6' 
  AND DDate BETWEEN #09-13-16# AND #09-13-17#

到

$("myDiv").on("click" ,".color-picker-icon" , function(){
    alert("hi");
    $("#color-picker-box").removeClass("display-none");
});

Answer 2

你在使用myDiv作为选择器时错过了＃！

错：

$("myDiv").cl....

修正：

$("#myDiv").cl.....

Answer 3

您需要使用事件委派，因为该元素尚未添加到dom中。您需要捕获其父级的点击。

$('#myDiv').on("click", "#color-picker-box", function(e){
  console.log('color box clicked');
});

了解更多信息： https://learn.jquery.com/events/event-delegation/
http://api.jquery.com/on/