Javascript 向DOM添加元素后，HTML锚不可单击_Javascript_Jquery_Html

Javascript 向DOM添加元素后，HTML锚不可单击

javascript jquery html

Javascript 向DOM添加元素后，HTML锚不可单击,javascript,jquery,html,Javascript,Jquery,Html,我创建了一个如下所示的html页面： <body> ... <div id="calendar-cont"> ... <div id="overview"> <div id="overview-type"> <h3>Selected Shift Type</h3> <div id=

我创建了一个如下所示的html页面：

<body>
    ...
    <div id="calendar-cont">
        ...
        <div id="overview">
            <div id="overview-type">
                 <h3>Selected Shift Type</h3>
                 <div id="selected-shift-type-cont"></div>
            </div>
            <div id="overview-dates">
                 <h3>Selected Dates</h3>
                 <ul id="selected-dates-cont"></ul>
            </div>
            <a href="#" id="submit-overview">Submit</a>
        </div>
    </div>
</body>

只要DOM保持现在的状态，此侦听器就可以工作。每当我向

所选班次类型cont

或

所选日期cont

添加一个元素时，侦听器就不再工作。有人知道为什么会出现这个问题吗

我这样添加元素：

var tmp = new Date(date.getTime());
dates[dates.length] = tmp;
$("#selected-dates-cont").append("<li>" + getDateString(tmp, "dd.mm.yyyy") + "</li>");

FF 22对我来说一切都很好

您必须使用较旧（读：过时）版本的jQuery，否则您的代码比您向我们展示的要多，或者您的浏览器已失效。请进一步说明

$("#submit-overview").click(function() {
   console.log("click");
   alert("still works");
});
window.setInterval(function() {
    $("#selected-dates-cont").append("<li>1/1/2000</li>");
    $("#selected-shift-type-cont").html("<div>blah</div>");
}, 4000);

$（“#提交概述”）。单击（函数（）{
控制台日志（“单击”）；
警惕（“仍然有效”）；
});
setInterval（函数（）{
$（“#选定日期续”）。追加（“1/1/2000”；
$（“#所选班次类型控制”）.html（“blah”）；
}, 4000);

FF 22对我来说一切都很好

您必须使用较旧（读：过时）版本的jQuery，否则您的代码比您向我们展示的要多，或者您的浏览器已失效。请进一步说明

$("#submit-overview").click(function() {
   console.log("click");
   alert("still works");
});
window.setInterval(function() {
    $("#selected-dates-cont").append("<li>1/1/2000</li>");
    $("#selected-shift-type-cont").html("<div>blah</div>");
}, 4000);

$（“#提交概述”）。单击（函数（）{
控制台日志（“单击”）；
警惕（“仍然有效”）；
});
setInterval（函数（）{
$（“#选定日期续”）。追加（“1/1/2000”；
$（“#所选班次类型控制”）.html（“blah”）；
}, 4000);

尝试

$（文档）。在（“单击”，“提交概述”，function（）{

而不是

$（“#提交概述”）。单击（function（）{

委派事件处理程序。但它不应与一起工作。单击（）还有？为什么会有这种奇怪的行为？你在添加的内容中复制了id#submit overview吗？还有：你的JavaScript放在哪里，什么时候运行？Benjamin Grunbaum，我也试过了，但没有改变什么…@Omar:我不认为这是你发布的问题的重复，因为我的链接不是动态添加的。而且链接是no在列表中。您的问题不清楚，似乎是关于将事件附加到动态添加的元素。由于您修改了问题并添加了更多相关数据，请投票重新打开。请尝试

$（文档）。在（“单击”，“提交概述”，function（）{/code>而不是$（“#提交概述”）。单击（function（）{委派事件处理程序。但它是否应与一起工作。单击（）还有？为什么会有这种奇怪的行为？你在添加的内容中复制了id#submit overview吗？还有：你的JavaScript放在哪里，什么时候运行？Benjamin Grunbaum，我也试过了，但没有改变什么…@Omar:我不认为这是你发布的问题的重复，因为我的链接不是动态添加的。而且链接是no在列表中。您的问题不清楚，似乎是关于将事件附加到动态添加的元素。由于您修改了问题并添加了更多相关数据，投票重新打开。您好，我为问题添加了一些额外的信息。而且您的JSFIDLE工作正常，因此我编写的代码也应该可以工作……您好，我添加了一些额外的信息回答这个问题。你的JSFIDLE也能正常工作，所以我写的代码也能正常工作。。。
#submit-overview {
    position: relative;
    z-index: 99;
}

$("#submit-overview").click(function() {
   console.log("click");
   alert("still works");
});
window.setInterval(function() {
    $("#selected-dates-cont").append("<li>1/1/2000</li>");
    $("#selected-shift-type-cont").html("<div>blah</div>");
}, 4000);