堆栈内存溢出
  繁体   English   中英

jquery click事件不起作用

[英]jquery click event doesn't work

 原文  2013-11-06 07:57:39  2   7    javascript/ jquery

问题描述

我编写了这段代码，我需要使用jquery处理点击事件，但它在任何浏览器中都不起作用，当我点击任何元素时都没有任何反应。 div在css中没有z-index;

孔“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>

这是我的jquery代码 

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

它不适用于“新闻”类中的任何元素

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

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

7 个解决方案

解决方案1
 53 已采纳  2013-11-06 08:03:52

正如你所展示的那样 ，你的代码和HTML 在jsFiddle中运行得很好。 因此，完全不像你展示的那样，这不是问题。 它更可能是页面中的环境或动态HTML。 一些可能性：

  1. 安装事件处理程序后，动态添加HTML元素。
  2. 您没有正确安装jQuery。
  3. 您有一个脚本错误，阻止其他脚本运行。
  4. 您的页面中某处有重复的ID。
  5. 你没有使用正确的选择器（也许你想要".news" ）

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

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

提示： $(document)实际上应该是#littleNews最接近的父#littleNews ，它在安装事件处理程序后不会动态创建。 我不知道那是什么，所以我选择了最安全的$(document) ，但是如果使用最接近的静态父级，事情表现更好（特别是如果你有很多委托的事件处理程序）。

从您的问题中不清楚，但如果您还希望您的事件处理程序覆盖.news所有内容， .news需要更改选择器以覆盖它。

解决方案2
 1  2013-11-06 09:11:41

尝试这样的事情 

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

解决方案3
 0  2013-11-06 08:00:57

我测试了你的代码，它的工作原理。

我想你不记得添加了jquery。 

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

演示

解决方案4
 0  2013-11-06 08:01:31

尝试这个， 

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

演示

解决方案5
 0  2013-11-06 08:04:45

你询问“新闻”课程。 您发布的代码不以任何方式引用它。

也许你想要这个？ 

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

小提琴

解决方案6
 0  2013-11-06 09:08:49

可能是其中一个div标签落在了littlenews div上。

测试：

为所有div设置（border：1px red solid）。

希望能帮助你。

解决方案7
 0  2018-10-15 11:07:02

确保你没有忘记将jQuery库添加到html文件中。 如果它发生在谷歌或微软cdn在<head> </head>添加它，如下解决问题。 

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

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 <a>标签上的</a> Click事件<a>在JQuery中不起作用</a> 如果在单击jquery事件中，clearInterval不起作用？ jQuery函数.on（）不适用于“click”事件 第一次单击后，jQuery单击事件不起作用 jQuery的。更改事件后，click事件不起作用？ jQuery脚本仅需单击即可很好地工作，不适用于keydown事件 另一个元素上的jQuery插件内的Click Event不起作用 Protovis jQuery Tipsy 不适用于单击事件 jquery 循环点击事件不适用于 eq(i) JQuery：向所有孩子添加点击事件，不起作用
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM