Javascript jquery单击事件不发生'；行不通

我写了这段代码，我需要用jquery处理点击事件，但它在任何浏览器中都不起作用，当我点击任何元素时，什么都不会发生。divs在css中没有z索引

“news”元素动态添加 这是html代码

<div class="news">
            <div class="meta-inform">
                <div id="waiting">not accepted</div>
                <div id="accpted">accepted</div>

                <div class="edit">
                <div class="editedBy" id="editedBy" >
                    <div id="editLabel"  style="display:inline">edited by</div>
                    <div id="editorName"  style="display:inline">arvin</div>
                </div>

                <div id="editTime" class="editTime">
                    <div id="editDate" style="display:inline" >چdate</div>
                    <div id="editDate" style="display:inline">time</div>
                </div>
                </div>

            </div>

        <div id="littleNews">
            <div id="number">1000</div>
            <div id="divider1"></div>
            <div id="title">title</div>
            <div id="divider2"></div>
            <div id="littleNewsTime">time</div>
            <div id="littleNewsDate">date</div>
            <div id="divider3"></div>
            <div id="category">cat</div>
            <div id="part">part</div>
            <div id="segment">sgmnt</div>
            <div id="divider4"></div>
            <div id="writer">writer</div>
            <div id="view">view post</div>
        </div>

        <div class="functions">
            <div id="edit">edit</div>
            <div id="delete">delete</div>
            <div id="accptThis">accept</div>
        </div>
        </div>

而且它不适用于“news”类中的任何元素

我有这段代码，这段代码创建了整个div

$("#news").clone().appendTo("#mainDiv").attr("id","news"+(i+1))

---

我测试了你的代码，它成功了

我想你不记得添加了jquery

$("#littleNews").click (function(){
 alert("hi");
});

试试这个

$(function () {
   $("#littleNews div").on('click',function () {
      alert($(this).text());
   });
});

---

您的代码和HTML工作正常，如您所示。所以，这并不是你所展示的那些东西的问题。它更可能与页面中的环境或动态HTML有关。一些可能性：

在安装事件处理程序后，将动态添加HTML元素

您没有正确安装jQuery

您的脚本错误会阻止其他脚本运行

您的页面中有重复的ID

您没有使用正确的选择器（可能需要

”.news“

）

---

如果在安装事件处理程序后动态添加HTML，则需要使用委托事件处理，如下所示：

$(document).ready ( function () {
    $(document).on ("click", "#littleNews", function () {
        alert("hi");
    });
});

提示：

$（文档）

实际上应该是与安装事件处理程序后未动态创建的

#littleNews

最接近的父级。我不知道这是什么，所以我选择了最安全的

$（document）

，但如果使用最接近的静态父级，则性能会更好（特别是当您有许多委托事件处理程序时）

---

您的问题不清楚，但如果您还希望事件处理程序涵盖

.news

中的所有内容，则需要更改选择器以涵盖这些内容。

您询问的是“news”类。你发布的代码没有以任何方式引用它

也许你想要这个

$(document).ready(function () {
    $("#littleNews, .news").click(function () {
        alert("hi");
    });
}); 

---

可能是littlenews div上的div标签之一

对于测试：

为所有分区设置（边框：1px红色实体）

---

希望能对你有所帮助。

试试这样的方法

            $(document).on('click','#littleNews',function () {
                alert("hi");
            });

---

确保您没有忘记将jQuery库添加到html文件中。 如果发生了这种情况，请在

中添加来自google或microsoft cdn的内容，如下所示即可解决此问题

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

动态添加的

littleNews

元素是否有效：对我也有效，在Chrome中测试该问题对“news”类中的任何元素都无效。jQuery代码根本不引用.news。这就是问题吗？谢谢你的关注，是的，整个新闻元素都增加了动态性。如果你采取这种方法，你可以用

$（“#littleNews”）将
div委派给
。在（'click'，'div'，fn）
@jfriend00上，真正从
click
切换到
on
的唯一原因是增加委派，用于动态内容。在这种情况下，如果
#littleNews
是静态的，并且它的子项是动态的。@DerFlatulator-现在（根据OP的评论）显示
#littleNews
可能是动态的。我在回答中添加了一个委托解决方案来处理这个问题。这取决于你如何定义“工作良好”。看问题的结尾。代码是有效的，但结果可能不是OP想要的。那么，你应该在答案中添加一些词，解释你试图解决的问题。没有解释为什么的纯代码没有那么有用，也没有那么清楚地告诉其他人你在做什么。专业提示，你可以通过回勾一些东西来避免“你必须使用代码”的事情。谢谢朋友们，我想这是因为你说的第4条；我有这个代码“$”（“#新闻”）.clone（）.appendTo（“#mainDiv”）.attr（“id”，“news”+（i+1））”，在此之前，我无法删除它，有没有办法修复单击的问题？@arvinkarimi-在要为特定事件处理程序工作的所有项目上放置一个公共类名，然后对该类名使用委托事件处理。假设mainDiv不是动态创建的，并且您在每个克隆的项目上都放置了
“newsItems”
类，那么您可以这样做：
$（“#mainDiv”）。在（“click”、“.newsItems”，fn）
@jfriend00上，我遇到了同样的问题，您解决了它！我的元素是在安装事件处理程序后创建的，但我不明白。。。这不是
$（document.ready
与脚本标记上的
defer
属性相同吗？我必须使用这两种方法才能使我的代码正常工作，但我认为这是一样的@弗兰普-我们必须更详细地了解您的具体情况，以便提供建议，这里的评论不是讨论这个问题的合适地方
$（document）.ready（）
和
defer
属性肯定不是一回事。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>