gpt4 book ai didi

javascript - 将元素添加到 DOM 后,HTML anchor 不可点击

转载 作者:行者123 更新时间:2023-11-28 02:06:48 34 4
gpt4 key购买 nike

我创建了一个如下所示的 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>

我还有一个用于标记的 jQuery 单击监听器:

$("#submit-overview").click(function() {
console.log("click");
submitDates();
});

只要 DOM 保持现在的样子,这个监听器就可以工作。每当我将元素添加到 selected-shift-type-contselected-dates-cont 时,监听器就不再工作。有谁知道为什么会出现这个问题?

我这样添加元素:

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

$("#selected-shift-type-cont").html("<div>" + shiftType.name + "</div>");

一旦执行这两段代码之一,我就无法再单击 anchor 。

更新:

我使用 jQuery 1.9.1。我还使用 Chrome(版本 28.0.1500.71)进行开发。当我在 Firefox 22 上测试它时,一切都按预期工作。因为我使用 jQuery .load() 方法根据用户在导航栏中单击的内容来更改主要内容。因此,我需要在本地主机上运行网站,我在 Mac 上使用 python -m SimpleHTTPServer 8001 命令来运行该网站。该命令从我调用该命令的目录启动一个网络服务器。这些因素是否可能是问题所在

更新2:

直到现在我才提到我使用 fullCalendar jQuery 插件。我还创建了一个 jsFiddle 来重现问题 http://jsfiddle.net/XagK5/3/ 。它包含所有重要部分,我还包含了整个 fullCalendar 缩小的 javascript 代码,因为我不知道如何包含外部脚本。

更新3:

如果我添加以下 CSS,它就会起作用:

#submit-overview {
position: relative;
z-index: 99;
}

最佳答案

http://jsfiddle.net/72wyN/1/

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);

关于javascript - 将元素添加到 DOM 后,HTML anchor 不可点击,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17654543/

34 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com