jquery事件及插件
jquery事件
| 方法 | 描述 |
|---|---|
| bind() | 向匹配元素附加一个或更多事件处理器 |
| blur() | 触发、或将函数绑定到指定元素的 blur 事件 |
| change() | 触发、或将函数绑定到指定元素的 change 事件 |
| click() | 触发、或将函数绑定到指定元素的 click 事件 |
| dblclick() | 触发、或将函数绑定到指定元素的 double click 事件 |
| delegate() | 向匹配元素的当前或未来的子元素附加一个或多个事件处理器 |
| die() | 移除所有通过 live() 函数添加的事件处理程序。 |
| error() | 触发、或将函数绑定到指定元素的 error 事件 |
| event.isDefaultPrevented() | 返回 event 对象上是否调用了 event.preventDefault()。 |
| event.pageX | 相对于文档左边缘的鼠标位置。 |
| event.pageY | 相对于文档上边缘的鼠标位置。 |
| event.preventDefault() | 阻止事件的默认动作。 |
| event.result | 包含由被指定事件触发的事件处理器返回的最后一个值。 |
| event.target | 触发该事件的 DOM 元素。 |
| event.timeStamp | 该属性返回从 1970 年 1 月 1 日到事件发生时的毫秒数。 |
| event.type | 描述事件的类型。 |
| event.which | 指示按了哪个键或按钮。 |
| focus() | 触发、或将函数绑定到指定元素的 focus 事件 |
| keydown() | 触发、或将函数绑定到指定元素的 key down 事件 |
| keypress() | 触发、或将函数绑定到指定元素的 key press 事件 |
| keyup() | 触发、或将函数绑定到指定元素的 key up 事件 |
| live() | 为当前或未来的匹配元素添加一个或多个事件处理器 |
| load() | 触发、或将函数绑定到指定元素的 load 事件 |
| mousedown() | 触发、或将函数绑定到指定元素的 mouse down 事件 |
| mouseenter() | 触发、或将函数绑定到指定元素的 mouse enter 事件 |
| mouseleave() | 触发、或将函数绑定到指定元素的 mouse leave 事件 |
| mousemove() | 触发、或将函数绑定到指定元素的 mouse move 事件 |
| mouseout() | 触发、或将函数绑定到指定元素的 mouse out 事件 |
| mouseover() | 触发、或将函数绑定到指定元素的 mouse over 事件 |
| mouseup() | 触发、或将函数绑定到指定元素的 mouse up 事件 |
| one() | 向匹配元素添加事件处理器。每个元素只能触发一次该处理器。 |
| ready() | 文档就绪事件（当 HTML 文档就绪可用时） |
| resize() | 触发、或将函数绑定到指定元素的 resize 事件 |
| scroll() | 触发、或将函数绑定到指定元素的 scroll 事件 |
| select() | 触发、或将函数绑定到指定元素的 select 事件 |
| submit() | 触发、或将函数绑定到指定元素的 submit 事件 |
| toggle() | 绑定两个或多个事件处理器函数，当发生轮流的 click 事件时执行。 |
| trigger() | 所有匹配元素的指定事件 |
| triggerHandler() | 第一个被匹配元素的指定事件 |
| unbind() | 从匹配元素移除一个被添加的事件处理器 |
| undelegate() | 从匹配元素移除一个被添加的事件处理器，现在或将来 |
| unload() | 触发、或将函数绑定到指定元素的 unload 事件 |
页面载入
ready(fn) // 当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。
$(document).ready(function(){}) -----------> $(function(){}) 事件绑定
//语法: 标签对象.事件(函数)
eg: $("p").click(function(){})
事件委派：
$("").on(eve,[selector],[data],fn) // 在选择元素上绑定一个或多个事件的事件处理函数。
扩展方法 (插件机制)
jQuery.extend(object)
扩展jQuery对象本身。
用来在jQuery命名空间上增加新函数。
在jQuery命名空间上增加两个函数:
<script>
jQuery.extend({
min: function(a, b) { return a < b ? a : b; },
max: function(a, b) { return a > b ? a : b; }
}); jQuery.min(2,3); // => 2
jQuery.max(4,5); // => 5
</script>
jQuery.fn.extend(object)
扩展 jQuery 元素集来提供新的方法（通常用来制作插件）
增加两个插件方法：
<body> <input type="checkbox">
<input type="checkbox">
<input type="checkbox"> <script src="jquery.min.js"></script>
<script>
jQuery.fn.extend({
check: function() {
$(this).attr("checked",true);
},
uncheck: function() {
$(this).attr("checked",false);
}
}); $(":checkbox:gt(0)").check()
</script> </body>
jquery事件及插件的更多相关文章
- jQuery插件 -- 动态事件绑定插件jquery.livequery.js
http://blog.csdn.net/zzq58157383/article/details/7721974 动态事件绑定插件livequery, 可以利用它给相应的DOM元素注册事件或者触发回调 ...
- jQuery事件，对象以及插件
回顾 1 基本使用 2 jquery 选择器 3 筛选器 过滤 查找 串联 4 DOM 操作 内部插入 append()appendTo()prepend()prependTo() 外部插入 afte ...
- jquery事件核心源码分析
我们从绑定事件开始,一步步往下看: 以jquery.1.8.3为例,平时通过jquery绑定事件最常用的是on方法,大概分为下面3种类型: $(target).on('click',function( ...
- Cropper – 简单的 jQuery 图片裁剪插件
Cropper 是一个简单的 jQuery 图像裁剪插件.它支持选项,方法,事件,触摸(移动),缩放,旋转.输出的裁剪数据基于原始图像大小,这样你就可以用它们来直接裁剪图像. 如果你尝试裁剪跨域图像, ...
- FlexSlider jQuery滑动切换插件 参数
demo:http://www.sucaihuo.com/jquery/0/6/demo/ FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果.适合所 ...
- 20款美化网站的 jQuery Lightbox 灯箱插件
jQuery Lightbox 灯箱插件可以让你为您的网站和应用程序展示优雅的图像,视频 和其它内容(使用模式窗口).如果你是一个开发人员,你必须拥有 jQuery 灯箱插件集合,因为有一部分的客户会 ...
- jQuery上定义插件并重设插件构造函数
插件alert的全部代码,每个插件都定义在如下类似的作用域中: +function ($) { 'use strict'; // ALERT CLASS DEFINITION // ========= ...
- jQuery 事件用法详解
jQuery 事件用法详解 目录 简介 实现原理 事件操作 绑定事件 解除事件 触发事件 事件委托 事件操作进阶 阻止默认事件 阻止事件传播 阻止事件向后执行 命名空间 自定义事件 事件队列 jque ...
- jQuery 图片剪裁插件初探之 Jcrop
主页:http://deepliquid.com/content/Jcrop.html 官方下载地址:http://deepliquid.com/content/Jcrop_Download.html ...
随机推荐
- 配置B类内网 和 配置A类内网
首先 A 类网 对应的 子网掩码是255.0.0.0 B 类网 对应的 子网掩码是255.255.0.0 C 类网 对应的 子网掩码是255.255.255.0 一般来说 10 开头的都是 A 类网 ...
- laravel 使用DB 鏈接leftJoin查詢
$product_count = DB::table('fook_platform_orderrefund as a') ->leftJoin('fook_platform_orderinfo ...
- 自动化测试神器 之 python unittest 断言
自动化测试的最后一步需要判断结果是否正确,而正确设置断言可以帮助判断测试用例的执行结果,从而提高自动化测试的效率,python unittest 提供了一个比较完整的断言方法.unittest框架测 ...
- Spring 集成Junit单元测试
1.在pom增加junit和spring-test <dependency> <groupId>junit</groupId> <artifactId> ...
- Golang如何使用websocket
下载websocket包 $ go get golang.org/x/net/websocket 如果下载失败,可能是被墙了. package golang.org/x/net/websocket: ...
- grep 正则问题 this version of PCRE is compiled without UTF support
问题 在使用grep -P,出现如下报错: grep: this version of PCRE is compiled without UTF support 原因 有些系统支持的正则规范不同. 解 ...
- Spring Cloud Eureka 服务治理
Spring Cloud Eureka 是 Spring Cloud Netflix 微服务套件的一部分,基于 Netflix Eureka 做了二次封装,主要负责完成微服务架构中的服务治理功能,服务 ...
- @media 响应式布局
能根据宽 高 屏幕等一些标签的变化来应用不同的样式叫响应式,如: <!DOCTYPE html> <html lang="en"> <head> ...
- 在IDEA中将SpringBoot项目打包成jar包的方法
SpringBoot项目无需依赖tomcat容器(内含)就可以发布,现在将打包步骤记录一下: 1. 打包前确认项目可以正常运行,打开Project Structure 快捷键 Ctrl+Shift+A ...
- 【spring】之事物配置，声明式事务管理和基于@Transactional注解的使用
http://blog.csdn.net/bao19901210/article/details/41724355