span的onclick事件无反应

最新推荐文章于 2022-12-16 14:33:07 发布
原创 最新推荐文章于 2022-12-16 14:33:07 发布 · 3w 阅读 · 12 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#span #onclick #无反应 #冒泡

本文介绍了一种在JavaScript中阻止事件冒泡的方法：通过在事件处理函数中使用event.stopPropagation()。这种方法可以有效防止事件向上级元素传递，避免触发不必要的操作。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

是因为产生了冒泡的原因，只需要在函数里加入禁止冒泡就可以了。
event.stopPropagation();

<span class="glyphicon glyphicon-star collecticon-red" onclick="attention()"></span>

function attention() {
     event.stopPropagation();
     // code            
}

加入第一句的代码就行了。下面的是实例。



对非可点击元素如(span)的click事件在有些手机上不触发如何解决？
王铁柱666的博客
03-13 451
如果你正在使用像 jQuery、React、Vue 或 Angular 这样的 JavaScript 库或框架，它们通常提供了自己的事件处理机制，这些机制可能更好地处理了跨浏览器和设备的兼容性问题。如果直接在非可点击元素上设置事件不起作用，你可以尝试在其父元素上设置点击事件，并使用事件委托来处理子元素的点击。这意味着当点击子元素时，父元素的事件处理程序会被触发，并可以根据需要执行相应的操作。虽然这不会直接解决事件触发的问题，但它会提高用户体验，让用户知道该元素是可以交互的。）可以“激活”该元素的点击能力。
span的onclick无效
weixin_30544657的博客
11-29 2666
span 一开始定义的时候是 span onclick="XX();" 这时候是有效的 但是如果你在js中动态的将它取消了 比如在别的函数体内 $("youSpan").onclick=""; 等你再想把它的onclick变成一开始的XX();的时候 你会发现变不回去了。。 解决方法： $("youSpan").onclick=function(){XX()}; 转载于:http...
span 的onclick事件没有响应
热门推荐
MelodyFreedom的博客
07-06 4万+
1、做了个按钮span，span的元素是图标如下：   点击span元素的时候，span元素没有响应。 后来查找资料才知道，span是div的子元素，点击span的时候，发生了事件冒泡，响应在了span的父元素div上，所以对onclick事件的响应应该是父元素，div。
span 的click事件没有响应
一只小蚂蚁的自白
10-31 1万+
示例： <span @click="action"></span> function action(){} 问题： 点击span元素的时候，span元素没有响应。 原因： span是div的子元素，点击span的时候，发生了事件冒泡，响应在了span的父元素div上，所以对click事件的响应应该是父元素div。 处理方式： 1、将span标签改为div...
＜span＞点击事件无效
毅香雪海的博客
12-16 1057
＜span＞点击事件无效
SpannableStringBuilder 点击事件失效
weixin_42685006的博客
08-06 962
代码】SpannableStringBuilder 点击事件失效。
ie6下a标签的onclick事件不执行问题解决方案
09-25
在IE6这个古老的浏览器环境中，开发者常常会遇到一些棘手的问题，其中之一就是`<a>`标签的`onclick`事件不被执行。这个问题对于那些希望通过点击链接触发JavaScript函数的开发者来说是个头疼的问题。本文将深入探讨...
调用innerHTML之后onclick失效问题的解决方法
09-04
在上述的描述中，开发者遇到了一个具体的问题：在调用`innerHTML`后，`onclick`事件不再生效。这个问题通常发生在动态生成或修改HTML内容时，例如在上述例子中，当用户点击按钮改变按钮状态（上线/下线）时，`...
解决layui动态添加的元素click等事件触发不了的问题
10-16
事件冒泡是指当一个事件在DOM树中发生时，该事件不仅仅会在它本身上发生，还会按照DOM树的层次结构逐级向上冒泡，直到根节点。利用这一原理，我们可以将事件监听器绑定到父元素上，而非目标元素本身。这样一来，即使...
window.event.srcElement 得到事件源对象
09-06
在JavaScript中，事件处理是相当重要的一个部分，它允许我们对用户的交互做出反应。`window.event.srcElement` 是一个在IE浏览器中获取触发事件的元素的方法。虽然在标准的DOM事件模型中，这个属性被`event.target`...
ant-design table columns onCell 无反应
最新发布
11-12
('span', null, '编辑') // 这里的函数需要返回一个DOM元素 ), onCell: (row) => { return { // 返回一个包含修改后的值的对象，比如这里可以添加点击事件 props: { onClick: () => console.log('cell clicked...
span的onclick事件
weixin_30544657的博客
01-15 4229
$("#tb_num_3g").attr("onclick","null"); 转载于:https://www.cnblogs.com/zhujiabin/p/5133748.html
Android 设置了ClickableSpan导致的上层View点击事件无法响应解决方案
qqwuy_muzi的博客
03-28 3945
首先感谢此题主及回答的大神提供了思路：点击打开链接　　首先问题是这样的：如果LinearLayout中包了一个TextView，TextView设置了ClickableSpan，这时如果恰巧LinearLayout和TextView都设置了点击监听，这时如果点击了ClickableSpan以外的文字，LinearLayout是接收不到监听事件的。比如：&lt;?xml version="1.0" ...
html span 无法点击,为什么span的点击失效
weixin_39809175的博客
06-25 1656
.left div,.right div {width: 500px;height: 100px;padding: 5px;margin: 5px;float: left;border: 1px solid #ccc;}.left div {background: #bbffaa;}.right div {background: yellow;}事件对象的属性与方法外层div元素内层span元素 ...
IE9及以下 span元素无法触发鼠标事件解决办法
crli的博客
06-28 2750
IE9及以下 span元素无法触发事件解决办法 今天向往常一样练习原生JS，做了个放大镜效果的小Demo，但是发现如下bug，测试了半天终于解决了！ 部分代码如下： html lang="en"> head> meta charset="UTF-8" /> title>Documenttitle> head> style type="text/css"> *{mar
点击按钮没反应,或者有时有反应有时没反应
Scofield_Hoo的专栏
10-04 1672
可能按钮超出了放它的view的边界，建议看看button的具体位置。
js中一些标签如<p><span>添加onclick失败的解决方案
weixin_41606022的博客
09-26 1959
html代码： <p id="fs">发送</p> js代码： function $(id) { return document.getElementById(id); } $('fs').onclick=function(){ //alert("333"); }
IE11下onclick不生效的问题
huahuahua__的博客
05-19 3640
前言 项目中的icon上绑定的click事件在IE11下无法被触发 具体问题 // HTML <div> <span></span> <span></span> <span></span> <span className=icon onClick={this.handleClick} style={{ position: relative; top: 2px }}></span> </d
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值