在jQuery代码中，event.target不能正常工作 - 腾讯云开发者社区

文章/答案/技术大牛

发布

VBA代码：在工作表中自动添加矩形

excelperfect 标签：VBA 这是在www.wimgielis.com中看到的一段代码，可以在工作表中自动添加一个矩形，用户可以指定矩形的大小和填充的颜色，以及指定相关联的宏。...VBA代码如下： Sub Add_Macro_Rectangle() Dim ws As Worksheet Dim sh...(1) If Len(s) = 0 Then s = .OnAction sText = Trim(Application.InputBox("请输入形状中的文本", "形状文本", s

2.3K1 0

jQuery 事件(三) 事件的绑定和解绑、对象的使用、自定义事件

jQuery根据 W3C 标准规范了事件对象，所以在jQuery事件回调方法中获取到的事件对象是经过兼容后处理过的一个标准的跨浏览器对象 ...event.which也将正常化的按钮按下(mousedown 和 mouseupevents)，左键报告1，中间键报告2，右键报告3 event.currentTarget : 在事件冒泡过程中的当前...DOM元素冒泡前的当前触发事件的DOM对象, 等同于this. this和event.target的区别： js中事件是会冒泡的，所以this是可以变化的，但event.target不会变化，它永远是直接接受事件的目标...DOM元素； .this和event.target都是dom对象如果要使用jquey中的方法可以将他们转换为jquery对象。...正常来说是不可以的，但是jQuery解决了这个问题，提供了一个trigger方法来触发浏览器事件 $('#elem').trigger('click'); //在绑定on的事件元素上，通过trigger

4.9K3 0

您找到你想要的搜索结果了吗？

是的

没有找到

18个JS单行代码片段，值得你在日常工作中应用

Number.isNaN(new Date(...val).valueOf()); isDateValid("December 17, 1995 03:24:00"); // Result: true 3、找出一年中的哪一天...1000 / 60 / 60 / 24); dayOfYear(new Date()); // Result: 272 4、将字符串大写 Javascript 没有内置的大写函数，因此我们可以使用以下代码...new Date("2021-10-22")) // Result: 366 6、清除所有 Cookie 你可以通过使用 document.cookie 访问 cookie 并清除它来轻松清除存储在网页中的所有...你可以使用 JavaScript 中的 Set 轻松删除重复项。...slice(1); rgbToHex(0, 51, 255); // Result: #0033ff 总结这18条非常实用的JavaScript One Lines，请你收藏好，如果有任何问题，请记得在留言区告诉我

1.5K2 0

事件对象的使用、属性和方法

事件对象只有事件发生时才会产生，并且只能是事件处理函数内部访问，在所有事件处理函数运行结束后，事件对象就被销毁 4 jQuery事件对象的作用 li都有一个共同的父元素，而且所有的事件都是一致的...，单击的是鼠标的哪个键 10 event.which 将 event.keyCode 和 event.charCode 标准化了，event.which也将正常化的按钮按下(mousedown...和 mouseupevents)，左键报告1，中间键报告2，右键报告3 11 event.currentTarget : 在事件冒泡过程中的当前DOM元素，冒泡前的当前触发事件的DOM对象, 等同于...this 12 this和event.target的区别 this是可以变化的，但event.target不会变化，它永远是直接接受事件的目标DOM元素 13 .this和event.target...都是dom对象，使用jquey中的方法可以将他们转换为jquery对象，比如this和$(this)的使用、event.target和$(event.target)的使用转帖：http://blog.51cto.com

2.2K3 0

解决Select2控件不能在jQuery UI Dialog中不能搜索的bug

所以不可能修改jQuery UI的源代码，而已修改源代码，在后期类库升级和维护上，各种坑还是比较多。所以我继续搜索解决版本。在jQuery UI的官网找到了方法。...hot fix代码如下： hot fix:Select2控件在jQuery UI弹出对话中不能搜索 $.widget("ui.dialog", $.ui.dialog, { open:...$(event.target).is(".select2-input") || this...._super(event); } }); 3.心得体会在前端开发中，虽然很多时候为了快速迭代和项目及时上线，我们会使用很多成熟的第三控件或者插件，我们在借助官网api之后，在项目正确的集成它之后...这样在遇到不可知的bug时，能快速找到问题的根源是关键。这也是工作之后，leader或者manager更加强调你发现问题和解决问题的能力。

2.1K10 0

导航菜单优化制作

以前制作导航菜单，总要加许多id在HTML中，js代码也要将id挨个加上去，今日终于习得破解之法，不在用以前那种笨拙的方法了。...以下是HTML代码：前端开发</...20px; display: none; cursor: pointer; } js我使用了构造函数进行封装，这样可以有效的避免js中命名重复的问题...i].style.display='block'; this.style.backgroundColor='#999'; }); 我们知道，for循环的便利在上面的函数中并不是我们所想的那样...event.target event.target可以指出当前鼠标所指的元素，我们可以利用这一点写一个函数： function findIndex(target,list){

4.7K7 0

导航菜单优化制作

本文作者：IMWeb 寒纱阁主原文出处：IMWeb社区未经同意，禁止转载以前制作导航菜单，总要加许多id在HTML中，js代码也要将id挨个加上去，今日终于习得破解之法，不在用以前那种笨拙的方法了...以下是HTML代码：前端开发</...20px; display: none; cursor: pointer; } js我使用了构造函数进行封装，这样可以有效的避免js中命名重复的问题...i].style.display='block'; this.style.backgroundColor='#999'; }); 我们知道，for循环的便利在上面的函数中并不是我们所想的那样...event.target event.target可以指出当前鼠标所指的元素，我们可以利用这一点写一个函数： function findIndex(target,list){

3.7K1 0

AI在开发者工作流中的应用：自动补全、代码审查与优化

AI在开发者工作流中的应用：自动补全、代码审查与优化引言在当今快速发展的软件开发领域，人工智能（AI）技术正逐渐渗透到开发者的日常工作中，为他们提供了强大的辅助工具，极大地提升了工作效率和代码质量。...其中，自动补全、代码审查与优化是AI在开发者工作流中应用最为广泛的三个领域。本文将深入探讨AI在这三个方面的具体应用、工作原理以及实际案例，帮助开发者更好地理解和利用这些技术。...代码审查：确保代码质量的关键环节AI在代码审查中的角色AI在代码审查中的应用主要体现在以下几个方面：静态代码分析：AI可以识别代码中的潜在错误、不良实践和安全漏洞，提供即时反馈。...代码优化：提升性能的智能助手AI在代码优化中的应用AI在代码优化方面主要通过以下方式提升代码性能：性能瓶颈分析：AI能够识别代码中的性能瓶颈，如不必要的循环、重复计算等。...结论AI技术在开发者工作流中的应用正逐渐改变传统的软件开发模式。自动补全、代码审查与优化作为AI在开发领域的重要应用，不仅提高了开发效率，还确保了代码质量和性能。

9850 0

js事件防止冒泡

事件处理程序中的变量event保存着事件对象。而event.target属性保存着发生事件的目标元素。这个属性是DOM API中规定的，可是没有被全部浏览器实现。...jQuery对这个事件对象进行了必要的扩展，从而在不论什么浏览器中都能够使用这个属性。通过.target，能够确定DOM中首先接收到事件的元素（即实际被单击的元素）。...与.target类似，这种方法也是一种纯JavaScript特性，但在跨浏览器的环境中则无法安全地使用。只是，仅仅要我们通过jQuery来注冊全部的事件处理程序。就能够放心地使用这种方法。以下。...那么在事件对象上调用.stopPropagation()方法也无济于事，由于默认操作不是在正常的事件传播流中发生的。...事件传播和默认操作是相互独立的两套机制，在二者不论什么一方发生时，都能够终止还有一方。假设想要同一时候停止事件传播和默认操作，能够在事件处理程序中返回false。

3.4K4 0

echarts图表在Tab页中width: 100%失效导致的第一个Tab页之后的Tab页图表不能正常显示的问题

解决Tab切换echarts图表不能正常显示问题： // 绘图div父容器的宽度 let w = $('.figure').width(); $('#fig-t').css('width...echarts.init(document.getElementById('fig-e'), 'white', {renderer: 'canvas'}); 上面只是解决了Tab页切换导致的图表显示问题，由于是在图表初始化的时候设置了容器宽度...，图表并不能随窗口缩放自适应，下面是解决方法： window.onresize = function () { // 绘图div父容器的宽度 let w = $('.figure').width

3.4K2 0

js判断是否是子元素

实现代码：方法一： function isParent (obj,parentObj){ while (obj != undefined && obj !...= 'BODY'){ if (obj == parentObj){ return true; } obj = obj.parentNode; } return false; } 方法二：jquery代码...//判断:当前元素是否是被筛选元素的子元素 jQuery.fn.isChildOf = function(b){ return (this.parents(b).length > 0); }; /.../判断:当前元素是否是被筛选元素的子元素或者本身 jQuery.fn.isChildAndSelfOf = function(b){ return (this.closest(b).length > 0..., parentId)) { //处理是子元素的情况 } else { //处理不是子元素的情况 } }) 在while循环中，俺使用赋值运算符=进行迭代，直到不再有父节点，在本例中为

13.7K0 0

JQuery 入门学习(完结)

大家可以看到，我用到的就是target属性，event.target指的就是触发mouseover事件的DOM元素，在这里就是td。所以在函数中，我们得到了鼠标所在的元素。...在Jquery中，有对html操作的一些函数，比如$(xx).html()，获取某元素内的内容。...而在单纯的javascript中，也有对html操作的DOM函数，比如xx.innerHTML，它也是获取某元素中的内容。而在实际运用中，这两种函数是不能互相使用的。...同样的，对于DOM对象event.target，也是不能使用Jquery的方法的。...大家用Jquery多了就会喜欢Jquery的简洁，但DOM对象并不能使用Jquery的方法，所以Jquery其实给了大家一个方式，能把DOM对象转换成Jquery对象，也就是把DOM对象直接放到$()中即可

1.3K1 0

jQuery的链式操作

mouseover(function(){$(this).addClass("over");}).mouseout(function(){$(this).removeClass("over");}) 在jQuery...但是问题，如果我们不看函数内部，我们并不知道callback会几时调用，在什么情况下调用，代码间产生了一定耦合，流程上也会产生一定的混乱。...jQuery中$(document).ready就非常好的阐释了这一理念。...DOMCotentLoaded是一个事件，在DOM并未加载前，jQuery的大部分操作都不会奏效，但jQuery的设计者并没有把他当成事件一样来处理，而是转成一种“选其对象，对其操作”的思路。...} bindReady(); },5); } } })(); 上面的代码不能用

7063 0

使用Zero Clipboard实现JS网页代码复制到剪贴板功能，所有浏览器全兼容

前几天，好友让我帮忙增加一个复制二维码链接的功能，虽然说这个功能在很多网站都能看到，但是你会经常看到“此功能不支持该浏览器，请手工复制文本框中内容”，这是因为大都用“window.clipboardData...很爽快的答应了朋友，网上也搜索了一大堆，大都同样的思路，个别针对浏览器增加几个判断，但都不能兼容所有浏览器。...相关代码 </...); client.on( "aftercopy", function( event ) { // `this` === `client` // `event.target` ===...; } ); } ); 插件相关信息 jQuery Zero官网：已不能访问，请访问Github jQuery Zero Clipboard Github地址：https://github.com

2.2K2 0

JavaScript 事件委托以及jQuery对事件委托的支持

事件委托具体是怎么工作的呢？我们从下面的简单的例子开始，给大家展示事件委托的工作原理。...jquery 对事件委托的支持在jQuery里对事件委托的支持，有以下几个函数： ?...如果我们在js中动态地给box1 增加子元素P，相应的处理函数也会对其有效。...与live() 相对应，取消绑定，则用下列代码： $("p").die(); 在事件绑定上，jQuery 提供了一种更通用的函数： on(events,[selector],[data],fn)...算法：将事件处理函数绑定到容器上，在事件处理函数内获取 event.target，根据不同的event.target作相应的处理应用场景：需要为子元素用一个事件处理函数处理相同的动作；简化不同动作间的结构

1.4K6 0

JQuery 摘要

否定式伪类: $(‘#myid li:not(.myClass)’)选择id为myid的元素中不属于myClass类的所有列表项(li)....event.target属性：保存发生事件的目标元素 event.stopPropagation(): 阻止事件继续冒泡 event.preventDefault(): 阻止事件的默认操作 $(...event.target).is(): 接收一个选择符表达式作为参数，并验证JQuery对象是否满足它。...unbind(): 移除事件处理事件命名空间：bind(‘click.sometag’, func) 可以在unbind的时候只解绑指定名字的事件。...css()方法不属于效果方法，不能排队，但可以用queue()方法将其加入队列，例如： * .fadeTo().queue(function(next){$(xxx).css(); next(

8461 0

【前端】详解JavaScript事件代理（事件委托）

这种方法可以提高性能，尤其是在处理大量元素时。本文将详细介绍事件代理的概念、原理、使用场景、代码示例以及注意事项。...提高性能：特别是在动态生成的元素上，不需要为新元素重新绑定事件。简化代码：统一处理事件，代码更简洁。...如果用了事件委托就没有这种麻烦了，因为事件是绑定在父层的，和目标元素的增减是没有关系的，执行到目标元素是在真正响应执行事件函数的过程中去匹配的；所以使用事件在动态绑定事件的情况下是可以减少很多重复工作的...缺点事件类型限制：只能捕获冒泡的事件，不能捕获不冒泡的事件。事件对象处理：需要通过事件对象的属性来确定事件的真正来源。...事件委托链：避免在多个元素上设置相同类型的事件代理，这可能导致事件处理逻辑混乱。事件对象：正确使用 event.target 或 event.currentTarget 来区分事件的来源。

1.7K1 0

拖放实现--兼容手机与pc端原

absolute;background:green;left:120px;">移动的div jquery.../2.1.1/jquery.min.js"> <script src="http://apps.bdimg.com/libs/bootstrap/3.3.0/js/bootstrap.min.js...handleEvent, false) } } } DragDrop().enable(); 拖放功能还不能真正应用起来...从这点上看，前面的代码没有提供任何方法表示拖动开始、正在拖动或者已经结束。这时，可以使用自定义事件来指示这几个事件的发生，让应用的其他部分与拖动功能进行交互。 event.target) { event.target = this; //console.log("not have eventTarget

1.6K2 0

JS获取事件对象，获取事件的源对象（Firefox，IE）

例如IE下，在js函数中，通过window.event就可以获取，不必在函数中添加什么参数。也可以用Prototype或者JQuery等，它们有他们对事件的包装。...event.srcElement : event.target;)来代替IE下的event.srcElement或者Firefox下的event.target.。...event.srcElement : event.target;)来代替IE下的event.srcElement或者Firefox下的event.target....在 ie中处理事件直接使用window.event对象即可,但在firefox中,是没有 window.event对象的,函数需要使用事件的时候,需要在事件发生时把事件作为参数传递给函数,不象在ie...中,事件对象是全局的,随处都可以访问.下面这个getEvent()函数可以兼容firefox和ie,只需要在访问事件对象的函数的开始调用getEvent()即可,不用再把事件作为参数传递.以下代码已经实验通过

11.9K5 0

jQuery源码解析之jQuery.event.dispatch()

} //this即目标元素 //delegateTarget:委托目标 event.delegateTarget = this; //这段代码压根不会执行...handlerQueue = [], //0 delegateCount = handlers.delegateCount, //目标元素 cur = event.target...( event.type === "click" && event.button >= 1 ) ) { //循环，event.target冒泡到cur.parentNode，...=== true ) ) { matchedHandlers = []; matchedSelectors = {}; //在每一层...handlerQueue; }, } 解析：注意下这个双层循环，目的是把每一层的委托事件的集合push进matchedHandlers，然后再将matchedHandlers放进handlerQueue队列在处理完每层的委托事件后

1.1K2 0

点击加载更多

VBA代码：在工作表中自动添加矩形

jQuery 事件(三) 事件的绑定和解绑、对象的使用、自定义事件

18个JS单行代码片段，值得你在日常工作中应用

事件对象的使用、属性和方法

解决Select2控件不能在jQuery UI Dialog中不能搜索的bug

导航菜单优化制作

导航菜单优化制作

AI在开发者工作流中的应用：自动补全、代码审查与优化

js事件防止冒泡

echarts图表在Tab页中width: 100%失效导致的第一个Tab页之后的Tab页图表不能正常显示的问题

js判断是否是子元素

JQuery 入门学习(完结)

jQuery的链式操作

使用Zero Clipboard实现JS网页代码复制到剪贴板功能，所有浏览器全兼容

JavaScript 事件委托以及jQuery对事件委托的支持

JQuery 摘要

【前端】详解JavaScript事件代理（事件委托）

拖放实现--兼容手机与pc端原

JS获取事件对象，获取事件的源对象（Firefox，IE）

jQuery源码解析之jQuery.event.dispatch()

相关资讯

热门标签

活动推荐

运营活动

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐