首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

杨老师课堂之Jquery的筛选,事件,效果,Ajax,javascript跨域)

事件冒泡可能会引起预料之外的效果,上例中,本来只想触发元素 的click事件,然而 元素和元素的click事件也同时被触 发了.因此有必要对事件的作用范围进行限制.当单击元素时,只 触发元素的click...可以用同样的方法解决 元素上的问题 阻止默认行为 网页中的元素都有自己默认的行为,例如:单击超链接后悔跳转,单击”提交”按钮会表单会提交,有时需要阻止元素的默认行为 在jquery中,提供了preventDefault...举一个例子,在项目中,经常需要验证表单,在单击”提交”按钮是,验证表单内容,例如元素是否是必填字段,某元素长度是否够6位,单表单不符合提交条件时,要阻止表单的提交 eg: $(“#sub”).bind(...); return false;//阻止链接跳转 }); (7)event.which()方法 该方法的作用是在鼠标单击事件中获取到鼠标左中右键,在键盘事件中获取键盘的按键....在jQuery 1.3中也可以接受一个字符串了。 •callback:载入成功时回调函数。

8.3K20

webapi(二)- 事件

事件 含义 事件是在编程时系统内发生的动作或者发生的事(比如用户再网页上单击一下按钮) 事件监听 让浏览器检测是否有事件产生,一旦有事件触发,就立即调用一个函数做出响应 也称为注册事件 语法: 元素....addEventListener('事件' , 要执行的函数) 事件监听三要素 事件源:哪个dom元素被事件触发了 事件:用什么方式触发 事件调用的函数 :要做什么事 例如: // 给元素注册上事件...DOM L3: DOM3级事件模块在DOM2级事件的基础上重新定义了这些事件,也添加了一些新事件类型 事件类型 1....焦点事件 表单获得光标 focus:获得焦点 blur:失去焦点 3. 键盘事件 键盘触发 keydown:键盘按下触发 keyup:键盘抬起触发 4....(回头再调用的函数) 如果将函数A作为参数传递给函数B时,我们称A为回调函数 即:当一个函数当作参数来传递给另外一个函数的时候,这个函数就是回调函数 // 回调函数:把一个函数当成参数传递给另外一个函数

72520
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    webAPIs02-事件

    即,监听用户的行为,做出反馈,比如:鼠标经过显示下拉菜单、点击按钮可以播放轮播图等等结合 DOM 使用事件时,需要为 DOM 对象添加事件监听,等待事件发生(触发)时,便立即调用一个函数。... 完成事件监听分成3个步骤: 获取 DOM 元素 通过 addEventListener 方法为 DOM 节点添加事件监听 等待事件触发,如用户点击了某个按钮时便会触发...事件处理程序 addEventListener 的第2个参数是函数,这个函数会在事件被触发时立即被调用,在这个函数中可以编写任意逻辑的代码,如改变 DOM 文本颜色、文本内容等。...事件类型 将众多的事件类型分类可分为:鼠标事件、键盘事件、表单事件、焦点事件等,我们逐一展开学习。 鼠标事件 鼠标事件是指跟鼠标操作相关的事件,如单击、双击、移动等。...接下来简单看一下事件对象中包含了哪些有用的信息: ev.type 当前事件的类型 ev.clientX/Y 光标相对浏览器窗口的位置 ev.offsetX/Y 光标相于当前 DOM 元素的位置 注:在事件回调函数内部通过

    75610

    5、React组件事件详解

    ; 当某个事件触发时,React根据这个内部映射表将事件分派给指定的事件处理函数; 当映射表中没有事件处理函数时,React不做任何操作; 当一个组件安装或者卸载时,相应的事件处理函数会自动被添加到事件监听器的内部映射表中或从表中删除...2、事件自动绑定 在JavaScript中创建回调函数时,一般要将方法绑定到特定的实例,以保证this的正确性; 2.在React中,每个事件处理回调函数都会自动绑定到组件实例(使用ES6语法创建的例外...); 注意:事件的回调函数被绑定在React组件上,而不是原始的元素上,即事件回调函数中的 this所指的是组件实例而不是DOM元素; 了解更多React中的thisReact组件中的this。...这些焦点事件工作在 React DOM 中所有的元素上 ,不仅是表单元素。...ReactEvent 通过设置原生事件绑定为冒泡阶段调用,且每次测试单击子元素按钮: 在子元素原生事件程序中阻止事件传播,则打印出: 子元素原生事件绑定事件触发; 在父元素元素事件程序中阻止事件传播

    3.7K10

    Web APIs第二天

    事件是在编程时系统内发生的动作或者发生的事情, 比如用户在网页上单击一个按钮 事件是在编程时系统内发生的动作或者发生的事情, 比如点击按钮 click 2. 什么是事件监听?...事件监听三要素: 事件源: 那个dom元素被事件触发了,要获取dom元素 事件: 用什么方式触发,比如鼠标单击 click、鼠标经过 mouseover 等 事件调用的函数: 要做什么事 事件类型要加引号...事件类型 1.鼠标事件/鼠标触发 click鼠标点击、mouseenter鼠标经过、mouseleave鼠标离开 2.焦点事件/表单获得光标 focus获得焦点、blur失去焦点 3.键盘事件/键盘触发...小米搜索框案例 ①开始下拉菜单要进行隐藏 ②表单获得焦点 focus,则显示下拉菜单,并且文本框变色(添加类) ③表单失去焦点,反向操作 //需求:当表单得到焦点,显示下拉菜单,失去焦点隐藏下来菜单 回调函数 如果将函数 A 做为参数传递给函数 B 时,我们称函数 A 为回调函数 简单理解: 当一个函数当做参数来传递给另外一个函数的时候,这个函数就是回调函数 点击

    1.1K60

    jQuery进阶前言

    前言: 在《jQuery入门》一文中,记录了jQuery选择器、属性与样式和DOM操作等内容,本文将对jQuery的事件以及Ajax相关知识点进行讲解。接下来就一起来学习一下。...一、鼠标事件: 1、点击事件click()和dbclick(): 点击事件,就是当用户点击鼠标时该响应的动作,click是单击,dbclick是双击。...3、select()事件: 当 textarea 或文本类型的 input 元素中的文本被选择时,会发生 select 事件。...类似的event.currentTarget : 在事件冒泡过程中的当前DOM元素,等同于this。...4、$.get(): 使用get()方法时,采用GET方式向服务器请求数据,并通过方法中回调函数的参数返回请求的数据,它的调用格式如下: $.get(url,function(data){...})

    2.4K20

    知识点 | JavaScript事件浅析

    分类:知识点,JavaScript 难度:★ 一个网页由三层组成(html 结构,js 行为,css 表现),一切的东西其实都建立在html上,html里面的dom提供了一些事件,然后通过js封装,我们可以用...js去调用dom上的事件。...在addEventListener中addEventListener(event事件名称,function回调函数,是否在捕获或冒泡阶段执行)第三个参数可以改变事件触发时机。...scroll 滚动的时候触发,无限滚动之类的一些效果 resize 放大缩小窗口的时候发生变化,和上面的scroll都需要注意去抖, 鼠标事件 传送门,去看鼠标事件 click 单击事件,在DOM上单击鼠标时候触发...控件事件 input 当内容发生改变的时触发,有可能是代码触发的改动兼容ie的话input propertychange change 当失去焦点时,内容改变触发 blur 失去焦点触发 focus 获得焦点触发

    1.3K30

    再谈BOM和DOM(7):HTML DOM Event 对象属性及DOM事件详细列表

    onclick 当用户点击某个对象时调用的事件句柄。 ondblclick 当用户双击某个对象时调用的事件句柄。 onerror 在加载文档或图像时发生错误。 onfocus 元素获得焦点。...鼠标事件 属性 描述 DOM onclick 当用户点击某个对象时调用的事件句柄。...2 onpageshow 该事件在用户访问页面时触发 onpagehide 该事件在用户离开当前网页跳转到另外一个页面时触发 onresize 窗口或框架被重新调整大小。...(<body 和 <frameset) 2 表单事件 属性 描述 DOM onblur 元素失去焦点时触发 2 onchange 该事件在表单元素的内容改变时触发( 事件 事件 描述 DOM onmessage 该事件通过或者从对象(WebSocket, Web Worker, Event Source 或者子 frame 或父窗口)接收到消息时触发 onmousewheel

    2.2K40

    文档和元素的几何滚动

    同样onreset也是只能通过单击重置按钮来触发,直接调用表单的reset()方法不会触发onreset事件处理程序 用户与表单元素交互时它们往往会触发click或change事件,通过定义onclick...或者onchange事件处理程序可以处理这些事件(h5中,可以直接在表单中添加type类型达到表单过滤的效果) 用户与表单元素交互时它们往往会触发click或change事件,通过定义onclick或onchange...表单每发生一个改变的时候,都会触发一个事件,从而可以通过事件调用回调函数。 一般来说,当按钮表单元素激活(甚至当通过键盘而不是鼠标)都会触发click事件。...单选框和复选框共用一个状态标识,它们的click和change事件都会被触发,相比一下change事件更加有用。 表单元素在收到键盘的焦点时也会触发focus事件。...失去焦点触发blur事件 在事件处理程序代码中关键字this将会触发该事件的文档元素的一个引用,或者通过this.form.x得到该表单中以x命名的元素 事件总结 提交触发的事件 当用户单击按钮(或者回车的时候

    5.2K00

    JavaScript(十二)

    ')" /> 在 HTML 中定义的事件处理程序可以包含要执行的具体动作,也可以调用在页面其他地方定义的脚本,如下: DOM 中的事件对象 兼容 DOM 的浏览器会将一个 event 对象传入到事件处理程序中,无论指定事件处理程序时使用什么方法: var btn = document.getElementById("...UI(User Interface,用户界面)事件,当用户与页面上的元素交互时触发 焦点事件,当元素获得或失去焦点时触发 鼠标事件,当用户通过鼠标在页面上执行操作时触发 滚轮事件,当使用鼠标滚轮(或类似设备...JavaScript 错误时在 window 上面触发,当无法加载图像时在 img 元素上面触发 scroll: 当用户滚动带滚动条的元素中的内容时,在该元素上面触发 resize: 当窗口或框架的大小变化时在...这个事件是 HTML 事件 blur 的通用版本 鼠标事件 DOM3 级事件中定义了 9 个鼠标事件: click: 在用户单击主鼠标按钮(一般是左边的按钮)或者按下回车键时触发 dblclick:

    2.9K20

    前端架构师之11_JavaScript事件

    行内绑定式与动态绑定式的异同 不同点: 实现语法不同,前者通过HTML标签的属性设置,后者在JS中处理DOM对象。 事件处理程序中关键字this的指向也不同。...例如,单击 标签后,会自动跳转到href属性指定的URL链接;单击表单的submit按钮后,会自动将表单数据提交到指定的服务器端页面处理。因此,我们把标签具有的这种行为称为默认行为。...为小球绑定单击事件,在处理函数中调用自定义的 animate() 实现小球的缓动。 编写 animate() 动画函数,在函数中利用定时器,根据缓动公式完成缓动动画。...事件名称 事件触发时机 focus 当获得焦点时触发(不会冒泡) blur 当失去焦点时触发(不会冒泡) 3.3 鼠标事件 鼠标事件是Web开发中最常用的一类事件。...,一般多用于 对象 mousedown 当按下任意鼠标按键时触发 mouseup 当释放任意鼠标按键时触发 mousemove 在元素内当鼠标移动时持续触发 在项目开发中还经常涉及一些常用的鼠标属性

    7410

    JQuery最全常用方法指南

    在每个页面中可以 有很多个函数被加载执行,按照fn的顺序来执行。 bind(type, [data], fn) 为每一个匹配元素的特定事件(像click)绑定一个或多个事件处理器函数。...事件 描述 支持元素或对象 blur() 元素失去焦点 a, input, textarea, button, select, label, map, area change() 用户改变域的内容...slideDown(speed, [callback]) 通过高度变化(向下增大)来动态地显示所有匹配的元素,在显示完成后可选 地触发一个回调函数。...slideUp(speed, [callback]) 通过高度变化(向上减小)来动态地隐藏所有匹配的元素,在隐藏完成后可选地 触发一个回调函数。...Jquery已经为我们提供了各种事件处理方法,我们无需在html元素上直接写事件,而可以直接为通过jquery获取的对象添加事件。

    11K31

    移动端app开发问题及理解

    onmousewheel 当鼠标滚轮整被滚动时 onscroll 元素滚动条被滚动时 移动端事件有 click 单击事件 类似于pc端click,移动端中,连续click触发有200ms-300ms...swipeUp 手指在屏幕上上滑触发 swipeDown 手指在屏幕上下滑触发 vant组件使用过程中遇到的问题 弹框dialog组件确认回调函数 最开始我绑定的是confirm事件 但是实际调用的时候接口一直调用进入死循环了...可以改用beforeClose事件 回调函数有两个参数,第一个判断点击的是确认按钮还是取消按钮。第二个感觉是可以关闭模态框 移动端消息推送 消息推送跟设备走还是跟人走?...当填写完维修单后,所有人都可以收到推送的消息通知,当组长分配维修单后,只有指定的人收到维修单的通知。分配的人会收到两条消息通知。...我的理解WebView相当于一个中间层,h5和原生应用交互都是通过原生应用中的WebView,h5调用原生应用注入其中的原生对象的方法,原生应用调用h5暴露在该环境中的JavaScript对象的方法,

    3.8K10

    浏览器事件

    浏览器事件 常用浏览器事件与DOM事件,包括鼠标事件、键盘事件、框架/对象事件、表单事件、剪贴板事件、打印事件、拖动事件、多媒体事件、动画事件、过渡事件。...ondblclick: 当双击页面时调用事件句柄。 oncontextmenu: 在点击鼠标右键打开上下文菜单时触发。 onmousedown: 鼠标按钮被按下时触发。...DOM事件 鼠标相关 onclick: 当用户点击某个对象时调用的事件句柄。...ontoggle: 该事件在用户打开或关闭元素时触发。 表单事件相关 onblur: 元素失去焦点时触发。 onchange: 该事件在表单元素的内容改变时触发。...onreset: 表单重置时触发。 onsearch: 用户向搜索域输入文本时触发。 onselect: 用户在输入框内选取文本时触发。 onsubmit: 表单提交时触发。

    2.4K20

    react面试题笔记整理

    componentWillReceiveProps调用时机已经被废弃掉当props改变的时候才调用,子组件第二次接收到props的时候在调用setState 之后发生了什么状态合并,触发调和: setState...(1)在map等方法的回调函数中,要绑定作用域this(通过bind方法)。(2)父组件传递给子组件方法的作用域是父组件实例化对象,无法改变。...(1)当使用箭头函数作为map等方法的回调函数时,箭头函数的作用域是当前组件的实例化对象(即箭头函数的作用域是定义时的作用域),无须绑定作用域。(2)事件回调函数要绑定组件作用域。...(3)父组件传递方法要绑定父组件作用域。总之,在 EMAScript6语法规范中,组件方法的作用域是可以改变的。生命周期调用方法的顺序是什么?...React 中 refs 的作用是什么Refs 是 React 提供给我们的安全访问 DOM元素或者某个组件实例的句柄可以为元素添加ref属性然后在回调函数中接受该元素在 DOM 树中的句柄,该值会作为回调函数的第一个参数返回

    2.7K30

    HTML中DOM 对象事件

    在 W3C 2 级 DOM 事件中规范了事件模型HTML DOM 事件 指明使用的 DOM 属性级别。 鼠标事件 属性 描述 DOM onclick 当用户点击某个对象时调用的事件句柄。...2 onpageshow 该事件在用户访问页面时触发 onpagehide 该事件在用户离开当前网页跳转到另外一个页面时触发 onresize 窗口或框架被重新调整大小。...( body 和 frameset) 2 表单事件 属性 描述 DOM onblur 元素失去焦点时触发 2 onchange 该事件在表单元素的内容改变时触发( input, keygen, select...其他事件 事件 描述 DOM onmessage 该事件通过或者从对象(WebSocket, Web Worker, Event Source 或者子 frame 或父窗口)接收到消息时触发 onmousewheel...2 screenX 返回当某个事件被触发时,鼠标指针的水平坐标。 2 screenY 返回当某个事件被触发时,鼠标指针的垂直坐标。

    1.4K20

    看不完的那种!前端170面试题+答案学习整理(良心制作)

    24.jquery中的deferred的功能 实现链式操作 指定同一操作的多个回调函数 为多个操作指定回调函数 提供普通操作的回调函数接口 25.什么是deferred对象 开发网站过程中,会遇到某些耗时很长的...可以为它们指定回调函数callback,就是事先规定,一旦运行结束,调用那些函数,但是,在回调函数方面,jquery的功能非常弱,为了改变这一点,jquery开发设计了deferred对象。...; i++){ // 在document作用域下执行回调函数,并传递事件对象 fnList[i].call(document,e) } // 执行完毕,切换ready状态 ready =...114.单击超链接后自动跳转,单击“提交”按钮后表单会提交等,有时候,为了阻止默认行为,怎么办 使用event.preventDefault()或在事件处理函数中返回false,即是return false...创建script标签,并插入DOM中,页面渲染完成后,执行回调函数。

    11.5K50

    jQuery学习笔记

    调用链处理 .add() 向已有的节点序列中添加新的对象 .andSelf() 在调用链中,随时加入原始序列 .eq() 指定索引选取节点,支持负数 .filter().is().not().find(...事件类型 行为事件: .click() 单击 .dbclick() 双击 .blur() 失去焦点时 .change() 值变化时 .focus() 获取焦点时 .focusin() jQuery扩展的获取焦点...Deferred Deferred对象是在jQuery1.5中引入的回调管理对象。其作用是把一堆函数按顺序放入一个调用链,然后根据状态来依次调用这些函数。AJAX的所有操作都是使用它来进行封装的。...jQuery还提供了一个 jQuery.when()的回调管理函数,可以用于方便地管理多个事件并发的情况。...当有回调函数返回 false时终止调用链的执行 CallbackS的控制方法: callbacks.add() 添加一个或一串回调函数 callbacks.fire() 激发回调 callbacks.remove

    3.5K20

    深入JavaScript之BOM、DOM和事件

    创建(获取):在html dom模型中可以使用window对象来获取 方法: Element:元素对象 获取/创建:通过document来获取和创建 方法 Node:节点对象,其他5个的父对象...特点:所有dom对象都可以被认为是一个节点 方法 属性 HTML DOM 事件监听机制 概念 常见的事件 点击事件 焦点事件 加载事件 鼠标事件 键盘事件 选择和改变 表单事件 事件简单学习 功能...谁调用我 ,我关谁 open() 打开一个新的浏览器窗口 返回新的Window对象 与定时器有关的方式 setTimeout() 在指定的毫秒数后调用函数或计算表达式。...常见的事件 点击事件 onclick:单击事件 ondblclick:双击事件 焦点事件 onblur:失去焦点 onfocus:元素获得焦点。 加载事件 onload:一张页面或一幅图像完成加载。...选择和改变 onchange 域的内容被改变。 onselect 文本被选中。 表单事件 onsubmit 确认按钮被点击。 onreset 重置按钮被点击。

    3K30

    原生 JS DOM 常用操作大全

    事件源 (具体作用在哪 个元素或标签上)事件类型 (指的是 例如:鼠标的点击,双击,经过,键盘的按下的键)处理程序 ( 指的是 事件触发后浏览器调用对应的处理程序(以函数的形式),也称为事件处理函数)...当鼠标离开时触发 具有事件冒泡 mouseenter 当鼠标经过时触发 不具有事件冒泡 mouseleave 当鼠标经过时触发 不具有事件冒泡 mousemove 当移动鼠标时触发contextmenu...(e){ e.preventDefault(); //阻止事件的默认跳转行为 }) 焦点事件 blur 元素失去焦点时触发 不会冒泡 focus 元素获得焦点时触发 不会冒泡 键盘事件 一般键盘事件使用在...(“scroll”,()=>{ console.log(element.scrollTop) }) 表单事件 change事件 当表单的值 发生改变时触发 事件对象 在触发DOM上的某个事件时会产生一个事件对象...方法一: 在处理程序内的最后 添加 return false ;方法二: 在 a标签中加 javascript:; 自定义属性操作 为什么需要自定义属性:用于在页面中存储数据而不用在数据库中存储 Element

    10810
    领券