首页
学习
活动
专区
圈层
工具
发布
    • 综合排序
    • 最热优先
    • 最新优先
    时间不限
  • 来自专栏Krryblog

    jQuery 事件绑定 和 JavaScript 原生事件绑定

    总结一下:jQuery 事件绑定 和 JavaScript 原生事件绑定 及 区别 jQuery 事件绑定 jQuery 中提供了四种事件监听绑定方式,分别是 bind、live、delegate、on JavaScript支持在标签中直接绑定事件 2.在JavaScript代码中onXXX绑定:在JavaScript代码中绑定事件可以使JavaScript代码与HTML标签分离,文档结构清晰,便于管理和开发 3.绑定事件监听函数:绑定事件的另一种方法是用 addEventListener() 或 attachEvent() 来绑定事件监听函数。 一. 在DOM元素中直接绑定 1. jQuery 中的事件绑定具有叠加性,JavaScript 的事件绑定则是可覆盖的。 原生的事件绑定,可以发现只执行了最后一个相同的绑定事件,后面绑定事件处理函数覆盖了前面的事件处理函数。

    7.1K20发布于 2018-09-10
  • 来自专栏积累沉淀

    JavaScript 事件绑定

    事件绑定分为两种:一种是传统事件绑定(内联模型,脚本模型),一种是现代事件绑定(DOM2级模型)。现代事件绑定在传统绑定上提供了更强大更方便的功能。 一.传统事件绑定的问题 传统事件绑定有内联模型和脚本模型,内联模型我们不做讨论,基本很少去用。先来看一下脚本模型,脚本模型将一个函数赋值给一个事件处理函数。 那么W3C现代事件绑定可以设置冒泡和捕获。 PS:IE中的事件绑定函数attachEvent()和detachEvent()可能在实践中不去使用,有几个原因:1.IE9就将全面支持W3C中的事件绑定函数;2.IE的事件绑定函数无法传递this;3 .IE的事件绑定函数不支持捕获;4.同一个函数注册绑定后,没有屏蔽掉;5.有内存泄漏的问题。

    4.2K60发布于 2018-01-11
  • 来自专栏柠檬先生

    jquery事件绑定

    preventBubble       第三个参数设置为false 将绑定一个函数。防止默认事件,阻止事件冒泡,默认值是true。    selector       一个选择器,当绑定事件处理程序的匹配最初传递给。    : .on()   在选定的元素上绑定一个或多个事件处理函数。    .trigger()   根据绑定到匹配元素的给定的事件类型执行所有的处理程序和行为。    用法:     解除绑定的所有段落都从委托的事件:       $("p").undelegate()     解除绑定的所有段落的所有委托点击事件:       $("p").undelegate

    4.9K70发布于 2018-01-19
  • jquery绑定回车事件

    jsp的页面 <input id="username"type="text" name="text" onkeyup="BindEnterUserName(event)"/> 这个是js的代码 //绑定回车事件 /*为了获得兼容性更高的按键绑定支持,使用document.getElementById获取到按钮对象*/ function BindEnterUserName(obj){ var button

    10210编辑于 2026-01-09
  • 来自专栏Czy‘s Blog

    Vue事件绑定原理

    Vue事件绑定原理 Vue中通过v-on或其语法糖@指令来给元素绑定事件并且提供了事件修饰符,基本流程是进行模板编译生成AST,生成render函数后并执行得到VNode,VNode生成真实DOM节点或者组件时候使用 addEventListener方法进行事件绑定。 描述 v-on与@用于绑定事件监听器,事件类型由参数指定,表达式可以是一个方法的名字或一个内联语句,如果没有修饰符也可以省略,用在普通元素上时,只能监听原生DOM事件,用在自定义元素组件上时,也可以监听子组件触发的自定义事件 .self: 只当事件是从侦听器绑定的元素本身触发时才触发回调。 .{keyCode | keyAlias}: 只当事件是从特定键触发时才触发回调。 前面介绍了如何编译模板提取事件收集指令以及生成render字符串和render函数,但是事件真正的绑定到DOM上还是离不开事件注册,此阶段就发生在patchVnode过程中,在生成完成VNode后,进行

    9.6K40发布于 2020-09-10
  • 来自专栏vue的实战

    js中绑定事件与解除绑定事件的3种方式

    方式一: btn.onclick = function (){ console.log("123"); }; btn.onclick = function (){ console.log("345");//只能打印这一个结果 }; 解除: btn.onclick = null; 方式二:谷歌 火狐支持 ie8不支持 btn.addEventListener("click",function(){ console.log("123")

    20.2K20发布于 2019-08-28
  • 来自专栏Java

    事件绑定(onmouseout,onmouseover)

    事件绑定(onmouseout,onmouseover) 小案例讲解 onmouseout 鼠标移出事件。 onmouseover 鼠标移入事件

    51600编辑于 2025-01-21
  • 来自专栏Czy‘s Blog

    Hooks与事件绑定

    Hooks与事件绑定 在React中,我们经常需要为组件添加事件处理函数,例如处理表单提交、处理点击事件等。 事件绑定 使用Hooks进行普通的合成事件绑定是一件很轻松的事情,在这个例子中,我们使用了普通的合成事件onClick来监听按钮的点击事件,并在点击时调用了add函数来更新count状态变量的值,这样每次点击按钮时 原生事件绑定 虽然React为我们提供了合成事件,但是在实际开发中因为各种各样的原因我们无法避免的会用到原生的事件绑定,例如ReactDOM的Portal传送门,其是遵循合成事件事件流而不是DOM的事件流 此外,很多库可能都会有类似addEventListener的事件绑定,那么同样的此时也需要在合适的时机去添加和解除事件绑定。 ,其中ref1的事件绑定是在组件挂载的时候进行的,而ref2的事件绑定是在count发生变化的时候进行的,看起来代码上只有依赖数组[]和[count]的区别,但实际的效果上差别就很大了。

    2.9K30编辑于 2023-04-24
  • 来自专栏企业平台构建

    jQuery on绑定事件问题

    </body> </html> 以前没注意,最近在使用on绑定事件时发现,通过for循环绑定动态绑定时,多个元素最终绑定的都是最后一次事件,不知道用while是不是也是一样,谁有清楚这种现象也可以说一下原因 解决方案:将for里面的绑定逻辑单独写一个函数即可。

    3.2K30发布于 2019-08-07
  • 来自专栏杨不易呀

    JSX-绑定事件

    JSX 绑定事件JSX 中绑定事件必须使用 驼峰命名<button onClick={this.btnClick}>按钮</button>事件监听方法中的 this, 默认情况下 React 在调用事件监听方法的时候 console.log(this); } } ReactDOM.render(<Home/>, document.getElementById('app'));</script>手动绑定一个箭头函数

    83900编辑于 2023-09-29
  • 来自专栏Devops专栏

    jquery 绑定click事件

    绑定click事件 给元素绑定click事件,可以用如下方法: $('#btn1').click(function(){ // 内部的this指的是原生对象 // 使用jquery

  • 1
  • 2
  • 4
  • 5
  • 6
  • 选项卡示例 通过index()方法可以得到点击事件的元素序号
    选项卡二的内容
    选项卡三的内容
    </body> </html> 这个click事件里面的

    5.5K50发布于 2019-05-30
  • 来自专栏White feathe 的博客

    JQuery绑定事件与移除事件、动画

    绑定事件:bind()、on()、live()、delegate()、keyup(); 触发事件:trigger(‘keyup’)、keyup(); 解绑事件:unbind()、off()、die ()、undelegate(); 符合事件:hover() 、toggle(); 事件绑定:bind(); ---- 一、绑定事件       JQuery绑定事件,除 bing() 方法之外 ,还有 on()、live()、one() 等 事件绑定方法。 绑定事件分类: (a) 绑定单个事件 $("#btn").bind("click",function(){ //代码块 console.log(123); }); (b) 同时绑定多个事件 /2013/0905/5993.html 二、移除事件 (a)使用 unbind() 方法 移除事件 $("button").click(function(){ $("p").unbind

    3.3K10编辑于 2021-12-08
  • 来自专栏达达前端

    uni-app 事件以及事件绑定

    事件修饰符 stop的使用会阻止冒泡,但是同时绑定了一个非冒泡的事件,会导致该元素上的catchEventName失效! prevent可以直接干掉,因为uni-app里没有什么默认事件,比如submit并不会跳转页面。 也不能做,因为uni-app没有removeEventListener,虽然可以直接在handleProxy中处理,但非常的不优雅,违背了愿意,暂不考虑按键修饰符:uni-app运行在手机端,没有键盘事件

    3.7K30发布于 2019-10-14
  • 来自专栏前端小叙

    jquery绑定事件的坑,重复绑定问题

    我实现点击table表格中的删除按钮,找到当前按钮的祖先元素tr 然后删除该行,但是我首先点击删除的时候要先弹出提示框,是否要下载,这时在点击删除按钮删除,之前没有考虑到事件重复绑定问题,所以每次点击删除的时候就会多选择几行 ,之后选择的越来越多,经过网友解答,成功解决,先把重复绑定的删除的click事件解绑再继续绑定,就没问题。

    3.1K10发布于 2018-07-24
  • 来自专栏一只想做全栈的猫

    【Angular6+】事件绑定

    Angular6+ 事件绑定 临近毕业开始了第二段实习,因为项目需求,技术栈从Vue转到Angular,才发现Angular已经到7了????? 事件绑定的基础语法

  • 或者可以使用带 on-前缀的形式 <button on-click 是的,这就是 Angular 中的双向绑定。 通过@HostListenr 把事件绑定在宿主监听器上 把一个事件绑定到一个宿主监听器,并提供配置元数据。 当宿主元素发出特定的事件时,Angular 就会执行所提供的处理器方法,并使用其结果更新所绑定到的元素。 如果该事件处理器返回 false,则在所绑定的元素上执行 preventDefault。

    2.2K30发布于 2019-05-26
  • 来自专栏飞鸟的专栏

    react中的事件绑定

    React中的事件绑定是将事件处理函数与组件的交互操作关联起来的过程。通过事件绑定,我们可以在React组件中响应用户的交互,并进行相应的操作。 React中的事件绑定特点React中的事件绑定具有以下特点:以驼峰命名:React中的事件名采用驼峰命名方式,如onClick、onChange等。 使用JSX语法:在JSX中,通过将事件处理函数作为属性值来绑定事件。使用事件对象:事件处理函数接收一个事件对象作为参数,可以通过事件对象获取相关信息。 自动绑定this:在类式组件中,事件处理函数会自动绑定组件实例的this。绑定事件处理函数要绑定事件处理函数,可以通过在JSX中使用事件名作为属性,并将事件处理函数作为属性值。 以下是一个简单的示例,展示了如何绑定一个点击事件:import React from 'react';class Button extends React.Component { handleClick

    5.1K30编辑于 2023-05-19
  • 来自专栏破晓之歌

    JS 事件绑定事件监听、事件委托详细介绍 转

    事件绑定 要想让 JavaScript 对用户的操作作出响应,首先要对 DOM 元素绑定事件处理函数。所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称。 在JavaScript中,有三种常用的绑定事件的方法: 在DOM元素中直接绑定; 在JavaScript代码中绑定绑定事件监听函数。 ; } 使用事件监听绑定事件 绑定事件的另一种方法是用 addEventListener() 或 attachEvent() 来绑定事件监听函数。下面详细介绍,事件监听。 ; } 事件监听的优点 1、可以绑定多个事件。 说明传统的事件绑定无法对动态添加的元素而动态的添加事件

    10.3K31发布于 2018-08-15
  • 来自专栏一个小程序员的成长笔记

    Jquery获取DOM绑定事件

    获取到当前正在执行的事件: $('#testDive').bind('click', function(event){alert('event: ' + event.type)}); 获取所有绑定事件

    2.8K20发布于 2018-10-10
  • 来自专栏Java

    事件绑定(onclick,onfocus,onblur)

    事件绑定(onclick,onfocus,onblur) 常用绑定方式 方式一:通过 HTML标签中的事件属性进行绑定 在HTML标签中加入,onclick属性,并在后面加上需要的方法。 <input type="button" οnclick='on()’> 下面是点击<em>事件</em><em>绑定</em>的 on() 函数 function on(){ console.log("我被点了"); } 完整代码: ,通过onclick<em>绑定</em>函数。 <input type="button" value="再点我" id="btn"> <script> // 获取 id="btn" 元素对象,通过调用 onclick 属性 <em>绑定</em>点击<em>事件</em> <em>事件</em>属性名 说明 onclick 鼠标单击<em>事件</em> onblur 元素失去焦点 onfocus 元素获得焦点 onload 某个页面或图像被完成加载 onsubmit 当表单提交时触发该<em>事件</em> onmouseover

    1.3K10编辑于 2025-01-21
  • 来自专栏怡文菌

    jquery 绑定回车(Enter )事件

    window.event : e; if(ev.keyCode==13) { $('#FormId).submit();//处理事件 } ... */ 某个控件: $('#id').keydown(function(e){ if(e.keyCode==13){ $('#FormId).submit(); //处理事件 } }); 取消回车事件: if (window.event.keyCode==13) window.event.keyCode=0   //这样就取消回车键了 如果想模拟Tab键,只要写成

    3.6K20编辑于 2022-12-15
  • 第 2 页第 3 页第 4 页第 5 页第 6 页第 7 页第 8 页第 9 页第 10 页第 11 页
    点击加载更多
    领券