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

02-老马jQuery教程-jQuery事件处理

1.4 触发这些简单事件 1.4.1 直接调用jQuery包装对象简单绑定事件方法 $('#btn').click(); // 触发点击事件 $('#btn').dbclick(); // 触发双击事件..., fn) 说明:jQuery 给所有匹配元素附加一个事件处理函数,即使这个元素是以后再添加进来也有效。...selector:一个选择器字符串用于过滤器触发事件选择器元素后代。如果选择< null或省略,当到达选定元素,事件总是触发。...3.1 事件对象属性介绍 event.type 获取事件类型 event.target 获取触发事件元素。jQuery其封装后,避免了各个浏览器不同标准差异。...事件命名空间 如果一个dom标签上添加事件非常多时候,有时候需要进行这些事件做一些分类和统一处理。那么绑定事件分类就需要用到事件命名空间。

2.7K80

JQuery最全常用方法指南

在每个 象上,这个事件处理函数只会被执行一次。其他规则与bind()函数相同。 trigger(type, [data]) 在每一个匹配元素上触发某类事件。....innerHTML; 3、如何获取jQuery集合某一项 对于获取元素集合,获取其中某一项(通过索引指定)可以使用eq或get(n)方法或者索引号获取,要注意,eq返回jquery对象,而...,我们无需在html元素上直接写事件,而可以直接为通过jquery获取对象添加事件。...例如: $("p").trigger("click"); //触发所有p元素click事件 (5)bind(eventtype, fn),unbind(eventtype): 事件绑定与反绑定 从每一个匹配元素中...使用jqueryjQuery.noConflict(); 方法即可把变量$控制权让渡给第一个实现那个库或之前自定义$方法。

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

02-老马jQuery教程-jQuery事件处理

可以通过事件处理程序事件对象data属性获取此值。 fn 事件处理程序。fn内部作用域中this指向当前DOM对象(注意不是jQuery包装对象) 返回值: jQuery包装对象!!!...], fn) 说明:jQuery 给所有匹配元素附加一个事件处理函数,即使这个元素是以后再添加进来也有效。...selector:一个选择器字符串用于过滤器触发事件选择器元素后代。如果选择< null或省略,当到达选定元素,事件总是触发。...3.1 事件对象属性介绍 event.type 获取事件类型 event.target 获取触发事件元素。jQuery其封装后,避免了各个浏览器不同标准差异。...事件命名空间 如果一个dom标签上添加事件非常多时候,有时候需要进行这些事件做一些分类和统一处理。那么绑定事件分类就需要用到事件命名空间。

6.4K00

jQuery中常用函数和属性详细解析

例子 $("#div1").find("p").hide().end().hide() 第一个hide()是对于p标签 然后用end()结束p标签引用而返回到#div1标签 所以第二个hide(...而filter()则是筛选divclass为rain元素。 一个是子集操作,一个是自身集合元素筛选。 is(expr)//判断现有集合是否属于‘expr'集合中一部分或是相等。...a : b; } }); 引用jQuery: 复制代码代码如下: $.min(3,4); //return 3 jQuery.fn.extend(object)给jQuery对象添加方法,是jQuery.prototype...fadeIn( speed, [callback] ) 通过不透明度变化来实现所有匹配元素淡入效果,并在动画完成后可选地触发一个回调函数。...queue( ) 取得第一个匹配元素动画序列引用(返回一个内容为函数数组) queue( callback ) 在每一个匹配元素事件序列末尾添加一个可执行函数,作为此元素事件函数 queue

2.5K10

JQuery 入门学习(二)

其实Jquery选择器可谓多种多样,css比较熟悉同学就很好学了,因为css语法Jquery选择器基本都能用。    ...我上次也提到了,ready是一个事件。我们上面说选择器,选择某元素作用,其实就是为了完成后面的工作。...ready()是一个事件绑定函数,中间那个function(){}就是我们为ready事件绑定函数。...我列举一些Jquery中常用事件及其绑定函数:         click 鼠标点击事件 (最常用,当鼠标点击某对象时触发此函数)         change 对象被改变(如input框中写入...(当鼠标移动时触发事件)     上次我举了几个例子,有一个就是点击按钮后“离别歌”出现在页面中,触发就是click事件

1.3K10

jquery对象和dom对象相互转换

1、关于页面元素引用 通过jquery$()引用元素包括通过id、class、元素名以及元素层级关系及dom或者xpath条件等方法,且返回对象为jquery 象(集合对象),不能直接调用dom...//返回表单输入框value值 $("input").val("test");   //将表单输入框value值设为test $("#msg").click();   //触发id为msg元素单击事件...,我们无需在html元素上直接写事件,而可以直接为通过jquery获取对象添加事件。...例如: $("p").trigger("click");     //触发所有p元素click事件 (5)bind(eventtype,fn),unbind(eventtype): 事件绑定与反绑定...使用jqueryjQuery.noConflict();方法即可把变 量$控制权让渡给第一个实现那个库或之前自定义$方法。

3.3K40

Jquery 使用技巧总结

》和《使用 jQuery 简化 Ajax 开发》 (说明:以上文档都放在了【附件】中) 四、语法总结和注意事项 1、关于页面元素引用 通过jquery$()引用元素包括通过id、class、...(0).innerHTML; 3、如何获取jQuery集合某一项 对于获取元素集合,获取其中某一项(通过索引指定)可以使用eq或get(n)方法或者索引号获取,要注意,eq返回jquery...value值设为test $("#msg").click(); //触发id为msg元素单击事件 $("#msg").click(fn); //为id为msg元素单击事件添加函数...Jquery已经为我们提供了各种事件处理方法,我们无需在html元素上直接写事件,而可以直接为通过jquery获取对象添加事件。...例如: $("p").trigger("click"); //触发所有p元素click事件 (5)bind(eventtype,fn),unbind(eventtype)

2.8K20

jQuery事件处理

jQuery中,事件处理是一项重要功能,使我们能够元素各种交互行为做出响应。jQuery提供了一系列方法来绑定、解绑和触发事件,以及操作事件对象。...以下是一些常用jQuery事件处理方法:on()方法:用于绑定一个或多个事件处理函数到选中元素上。可以绑定多个事件类型,并可以使用选择器来特定子元素进行委托处理。...下面是trigger()方法使用示例:$("button").trigger("click");上述示例将触发所有元素上点击事件click()方法用于绑定或触发点击事件。...可以使用click()方法来绑定点击事件处理函数,也可以通过调用click()方法触发点击事件。...下面是click()方法使用示例:$("button").click(function() { // 处理点击事件});上述示例将为所有元素绑定一个点击事件处理函数,并在点击时触发

82830

事件绑定几种常见方式

1.事件绑定几种常见方式(以click事件为例) jquery: $(selector).click(function(){...})...[注意:live事件jQuery 1.7以后版本使用on代替live,且移动设备safari浏览器不支持live事件] 【穿插解决方案: 移动设备safari浏览器不支持live事件 方法一: 首先要给绑定...) 如果方法一你无效,你也可以用 方法二: 同样也给绑定click事件元素加上样式:cursor: pointer; 然后用on来绑定事件jquery1.7后推荐用on来动态绑定事件,因为比...函数   可能有时候需求需要触发某个特定事件,这时我们会想当然使用trigger触发事件,但是却没有考虑到带来隐患。...; } 1、直接在元素上绑定回调函数 click me 2、JS获取DOM元素对象后,onclick属性赋值

1.8K80

JavaScript学习笔记(四)—— jQuery入门

;//设置文本内容 }); }); HTML内容进行操作 jQuery提供了两种方法HTML进行操作,分别是html()方法和html(val)方法,同样是一个获取,...}); }); 元素属性进行操作 jQuery提供了attr()方法元素属性进行设置或返回操作。...keypress 在键盘上按下一个能产生字符按键时触发 返回ASCII码 keyup 松开某一键时触发 返回键盘代码 jQuery事件处理 1. jQuery常用事件方法 鼠标操作事件 方法...切换与触发事件 切换事件 有两个方法用于事件切换,一个是hover,一个是toggle 当需要设置鼠标悬停和鼠标移除事件中进行切换时,使用K方法: <script type="text/javascript...trigger(type,[data])函数式<em>jQuery</em>提供<em>的</em><em>事件</em><em>触发</em>器之一,其作用是<em>对</em>页面上所有匹配<em>的</em>元素<em>触发</em>某一类型<em>的</em><em>事件</em>。

11.2K50

jQuery 教程

页面中指定一个点击事件:$(“p”).click(); 下一步是定义什么时间触发事件。...您可以通过一个事件函数实现: $("p").click(function(){ // 动作触发后执行代码!!...该事件方法在 jQuery 语法 章节中已经提到过。 click() click() 方法是当按钮点击事件触发时会调用一个函数。 该函数在用户点击 HTML 元素时执行。...方法 描述 bind() 向元素添加事件处理程序 blur() 添加/触发失去焦点事件 change() 添加/触发 change 事件 click() 添加/触发 click 事件 dblclick(...添加 click 事件之间要切换两个或多个函数 trigger() 触发绑定到被选元素所有事件 triggerHandler() 触发绑定到被选元素指定事件所有函数 unbind() 从被选元素上移除添加事件处理程序

17K20

jQuery设计思想

做了一个详细笔记,试图理清jQuery设计思想,找出学习脉络。我目标是全面掌握jQuery,遇到问题时候,心里有底,基本知道使用它哪一个功能,然后可以迅速从手册中找到具体写法。...下面就是我笔记,应该是目前网上不多jQuery中文教程之一。....children(); //选择div所有子元素   $('div').siblings(); //选择div同级元素 三、链式操作 jQuery设计思想之三,就是最终选中网页元素以后,可以对进行一系列操作...$("p").one("click", function() {     alert("Hello"); //只运行一次,以后点击不会运行   }); .unbind()用来解除事件绑定。   ...    }   }); 有两种方法,可以自动触发一个事件

2.2K60

jQuery 入门指南教程

jQuery基本设计和主要用法,就是”选择某个网页元素,然后其进行某种操作”。这是区别于其他函数库根本特点。...对于获取元素集合,获取其中某一项(通过索引指定)可以使用eq或get(n)方法或者索引号获取,要注意,eq返回jQuery对象,而get(n)和索引返回是dom元素对象。...$('#msg').click(); // 触发 id 为 msg 元素单击事件 $('#msg').click(fn); // 为 id 为 msg 元素单击事件添加函数 如果选中多个元素,...不存在)就删除(添加)名称为 myClass class 选中网页元素以后,就可以对进行某种操作。...原理在于每一步jQuery操作,返回都是一个jQuery对象,所以不同操作可以连在一起。

1.2K11

JQuery第三节

事件解绑 2.4. 触发事件 2.5. jQuery事件对象 3. jQuery补充知识点 3.1. 链式编程 3.2. each方法 3.3....$(selector).position(); 2. jQuery事件机制 JavaScript中已经学习过了事件,但是jQueryJavaScript事件进行了封装,增加并扩展了事件处理机制。...最现代方式,兼容zepto(移动端类似jQuery一个库),强烈建议使用。 on注册简单事件 // 表示给$(selector)绑定事件,并且由自己触发,不支持动态绑定。...$(selector).on( "click", function() {}); on注册委托事件 // 表示给$(selector)绑定代理事件,当必须是内部元素span才能触发这个事件,支持动态绑定...触发事件 $(selector).click(); //触发 click事件 $(selector).trigger("click"); 2.5. jQuery事件对象 jQuery事件对象其实就是js

79030

jQuery,和嵌入其中Ajax

库是一个 JavaScript 文件,您可以使用 HTML 标签引用它: jQuery 语法 jQuery 语法是通过选取 HTML 元素,并选取元素执行某些操作。...基础语法:$(selector).action() 美元符号定义 jQuery 选择符(selector)"查询"和"查找" HTML 元素 jQuery action() 执行元素操作 实例:...选取单选按钮 点击元素 在事件中经常使用术语"触发"(或"激发")例如:"当您按下按键时触发 keypress 事件"。 ?...基于已经存在 CSS 选择器,除此之外,它还有一些自定义选择器。 jQuery中所有选择器都以美元符号开头:$()。 元素选择器 jQuery元素选择器基于元素名选取元素。...页面中指定一个点击事件: $("p").click(); 下一步是定义什么时间触发事件。您可以通过一个事件函数实现: $("p").click(function(){// 动作触发后执行代码!!

3.1K20

jQuery中on()、bind()、live()、delegate()之间区别

jQuery.on()、.bind()、.live()和.delegate()之间区别并非总是那么明显,然而,如果我们所有的不同之处都有清晰理解的话,那么这将会有助于我们编写出更加简洁代码,...click事件接着会向树根方向传播,广播到父元素,然后接着是每个祖先元素,只要是某个后代元素上单击事件触发事件就会传给它。 ? 在操纵DOM语境中,document是根节点。...及其以上版本;jquery1.7版本出现之后用于替代bind(),live()绑定事件方式; event 必需项;添加到元素一个或多个事件,例如 click,dblclick等; 单事件处理:例如...;适用所有版本,但是根据官网解释,自从jquery1.7版本以后bind()函数推荐用on()来代替。...; }); 当我们在a 上面点击时候,首先会触发它本身所绑定click事件,然后会一路往上,触发父元素,祖先元素上所有绑定click事件

1.2K30

jQuery:详解jQuery事件(一)

当文档或者某些元素发生某些变化或操作时,浏览器就会自动生成一个事件。当然使用传统JavaScript也能完成这些交互,但是jQuery增加兵扩展了基本事件处理机制。...).ready()方法注册事件处理程序,在DOM完全就绪时就可以被调用,也即此时网页所有元素jQuery都是可以访问,但是并不是这些元素关联文件都已经下载完毕。   ...如果处理函数绑定给window对象,则会在所有的内容(包括窗口、框架、对象和图像等)加载完毕后触发,出国处理函数绑定在元素上,则会在元素内容加载完毕后触发。   ...(){ //code... }   多次调用: window.onload方法是不能被多次调用,因为JavaScriptonload事件一次只能保存一个函数引用,它会自动用后面的函数覆盖前面的函数...).next().show(); //获取并显示“内容”元素 }) })   当然可以加强效果,并且改变绑定事件类型,比如鼠标悬停时显示“内容”,鼠标离开时隐藏“内容”。

1.6K20
领券