Question

我正在尝试在我的jsfiddle中实现一个简单的点击功能，但它无效。

这是我的javascript / jquery：

$(document).on("click", "#introPic", function () {
    $("#introduction").addClass("hide")
    $("#q1").removeClass("hide")
});

我不明白，因为如果我将有问题的元素（#introPic）从嵌入的div中取出并将其放在文档的顶部，它就有效。这不是解决方案，因为它会破坏所有html / css格式。

.on()仅适用于未嵌套的ID吗？

这是jsfiddle - http://jsfiddle.net/JosephByrne/HdPq4/2/

以下是修改后的版本，#introPic移到了html的顶部 - http://jsfiddle.net/JosephByrne/kRudM/

Answer 1

你的代码很好。问题是#introduction放在body元素后面，因为z-index:-99设置在#content上，#introduction是#content的容器。因此，点击z-index中的任何元素都会实际点击body元素。只需删除#content即可正常使用。

这里有趣的是身体的背景应覆盖html，但只有在为{{1}}元素指定一些背景时才会发生。

Answer 2

试试这个：

<script>
$(function(){
    $(document).on("click", "#introPic", function () {
        $("#introduction").addClass("hide");
        $("#q1").removeClass("hide");
    });
});
</script>

您的代码无效，因为您忘记以分号终止行。

.on（）jQuery点击功能不起作用？

2 个答案: