JQuery扩展和事件

时间:2022-04-03 11:49:20
一、jQuery事件

常用事件
blur([[data],fn]) 失去焦点
focus([[data],fn]) 获取焦点( 搜索框例子)
change([[data],fn]) 当select下拉框中的元素发生改变的时候触发change事件(select例子)
click([[data],fn]) 点击
dblclick([[data],fn]) 双击
scroll([[data],fn]) 滚动
submit([[data],fn]) 提交 不常用事件
error([[data],fn])
focusin([data],fn)
focusout([data],fn)
keydown([[data],fn]) 按下
keypress([[data],fn]) 按键
keyup([[data],fn]) 键松开
mousedown([[data],fn]) 鼠标按下
mouseenter([[data],fn]) 鼠标移进去
mouseleave([[data],fn]) 鼠标离开:只有鼠标离开被选元素的时候,才会触发mouseleave事件
mousemove([[data],fn]) 鼠标移动
mouseout([[data],fn]) 鼠标离开:无论鼠标离开被选元素还是任何子元素,都会触发mouseout事件
mouseover([[data],fn] 鼠标悬停
mouseup([[data],fn]) 鼠标弹起
resize([[data],fn]) 元素窗口发生变化
select([[data],fn])
unload([[data],fn])
补充:
文档树加载完之后绑定事件(绝大多数情况下)
第一种:吧script放在后面。
第二种:
$(document).ready(function(){
// 绑定事件的代码
....
}) 简写:
$(function($){
// 绑定事件的代码
....
}); 二、jQuery扩展(很重要!!) 1、jQuery扩展语法 把扩展的内容就可以写到xxxx.js文件了,在主文件中直接导入就行了。 用法1、$.xxx()
$.extend({
"GDP": function () {
console.log("戴小红花");
}
});
- 给jQuery添加扩展
- $.GDP() 用法2、$("").xxx()
$.fn.extend({
"BJG": function () {
console.log("英语八级就是好!");
}
})
- 给jQuery对象添加扩展
- $(":input").BJG() 三、表格的添加 | 删除 | 编辑示例 第一种:点击编辑没有模态框,是input框编辑修改
第二种:点击编辑有模态框 补充: - .data()
- .data("key", value) 保存值,value可以是字符串,也可以是数组,也可以是jquery对象
- .data("key") 获取值(没有值就返回undefined)
- .removeData() 删除所有 - .removeData("key") 删除key对应的value

JQuery扩展和事件的更多相关文章

  1. 前端之JQuery:JQuery扩展和事件

    jQuery之jQuery扩展和事件 一.jQuery事件 常用事件 blur([[data],fn]) 失去焦点 focus([[data],fn]) 获取焦点( 搜索框例子) change([[d ...

  2. jQuery之jQuery扩展和事件

    一.jQuery事件 常用事件 blur([[data],fn]) 失去焦点 focus([[data],fn]) 获取焦点( 搜索框例子) change([[data],fn]) 当select下拉 ...

  3. jquery扩展鼠标mousewheel事件

    最近项目中要有个鼠标在图片上滚动实现图片放大和缩小的得到功能,隐约的记得好像记得有个 mousewheel 事件,可以实现需求,于是乎,开始在网上查找这一方法,但是,出乎意料的结果,各浏览器对此方法有 ...

  4. Python之Web前端jQuery扩展

    Python之Web前端: 一. jQuery表单验证 二. jQuery扩展 三. 滚动菜单 一. jQuery表单验证: 任何可以交互的站点都有输入表单,只要有可能,就应该对用户输入的数据进行验证 ...

  5. jQuery:详解jQuery中的事件(一)

    之前用过一些jQuery的动画和特效,但是用到的部分也不超过10%的样子,感觉好浪费啊——当然浪费的不是jQuery,而是Web资源.后来就想深入研究下jQuery的内部机理,读过两遍jQuery源代 ...

  6. jQuery的常用事件

    1.$(document).ready() $(document).ready()是jQuery中响应JavaScript内置的onload事件并执行任务的一种典型方式.它和onload具有类似的效果 ...

  7. 【jQuery基础学习】03 jQuery中的事件与动画

    关于jQuery中的事件 js与HTML之间的交互是通过用户和浏览器操作页面时引发的事件来处理的. jQuery增加并扩展了基本的事件处理机制,jQuery不仅提供了更加优雅的事件处理方法,而且极大地 ...

  8. jQuery中的事件与动画<思维导图>

    Javascript和HTML之间的交互是通过用户和浏览器操作页面时引发的事件来处理的.当文档或者它的某些元素发生某些变化或操作时,浏览器会自动生成一个事件.例如当浏览器装载完一个文档后,会生成事件. ...

  9. Jquery基础之事件操作

    事件是用户操作时页面或页面加载时引发的用来完成javascript和HTML之间的交互操作.常见的元素点击事件.鼠标事件.键盘输入事件等,较传Javascript 相比JQuery增加并扩展了基本的事 ...

随机推荐

  1. 蓝牙4.0 BLE基础之vdd检测new

    外部ADC通道,我们现在用的是A0脚,也就是P00通道 把它设置成输出的一个模式.在程序中设置,代码如下: #include <ioCC2540.h> #define HAL_ADC_RE ...

  2. &lbrack;转&rsqb; Spring MVC sample application for downloading files

    http://www.codejava.net/frameworks/spring/spring-mvc-sample-application-for-downloading-files n this ...

  3. centos shell编程6一些工作中实践脚本 nagios监控脚本 自定义zabbix脚本 mysql备份脚本 zabbix错误日志 直接送给bc做计算 gzip innobackupex&sol;Xtrabackup 第四十节课

    centos   shell编程6一些工作中实践脚本   nagios监控脚本 自定义zabbix脚本 mysql备份脚本 zabbix错误日志  直接送给bc做计算  gzip  innobacku ...

  4. PHP工程师突破

    身边有几个做PHP开发的朋友,因为面试,也接触到不少的PHP工程师,他们常疑虑自己将来在技术上的成长与发展,我常给他们一些建议,希望他们能破突自己,有更好的发展. PHP工程师面临成长瓶颈 先明确我所 ...

  5. JavaScript 继承方式详解

    js继承的概念 js里常用的如下两种继承方式: 原型链继承(对象间的继承)类式继承(构造函数间的继承) 由于js不像java那样是真正面向对象的语言,js是基于对象的,它没有类的概念.所以,要想实现继 ...

  6. 2D游戏编程7—星空案例

    // INCLUDES /////////////////////////////////////////////// #define WIN32_LEAN_AND_MEAN // just say ...

  7. CentOS 7下用firewall-cmd

    一 .控制端口/服务 可以通过两种方式控制端口的开放,一种是指定端口号另一种是指定服务名.虽然开放http服务就是开放了80端口,但是还是不能通过端口号来关闭,也就是说通过指定服务名开放的就要通过指定 ...

  8. day43-python消息队列二-queue模块

    Python提供了Queue模块来专门实现消息队列Queue对象 Queue对象实现一个fifo队列(其他的还有lifo.priority队列,这里不再介绍).queue只有maxsize一个构造参数 ...

  9. float和position谁好?

    float从字面上的意思就是浮动,float能让元素从文档流中抽出,它并不占文档流的空间,典型的就是图文混排中文字环绕图片的效果了.不过需要注意的是清除浮动是我们可能需要注意的地方.而position ...

  10. Game Engine Architecture 3

    [Game Engine Architecture 3] 1.Computing performance—typically measured in millions of instructions  ...