原生js事件和jquery事件的执行顺序问题
场景:近日,写前端页面时候,在针对输入框input操作时,用到了jquery的插件,插件中使用了jquery的focus()和blur()方法。但是同时,又需要在插件之外再针对输入框的获取焦点和失去焦点进行一些一些逻辑操作。
思路一:改写插件,使用回调函数或初始化函数。
原来的插件并没有使用回调函数或初始化函数。可以改写插件,增加回调函数或初始化函数,视情况,在原来逻辑执行之前或之后先执行逻辑操作。
思路二:使用原生js事件。
开始的时候并没有这个思路,但是由于原生js事件函数onfocus()和onblur()已经写出来了。于是运行试试。惊奇的发现,实际运行起来后,并没有和jquery发生冲突。通过console.log()记录日志发现,原生的js事件onfocus()在jquery的focus()之前执行。同时测试了,onclick()和onblur()事件,也都是在jquery的click()和blur()事件之前执行。
由于思路二的方法较为简易,不用改写插件。所以,最后采用了思路二的方法。
原生js事件和jquery事件的执行顺序问题的更多相关文章
- js进阶 12 jquery事件汇总
js进阶 12 jquery事件汇总 一.常用事件 页面载入事件 ready() 文档就绪事件(当 HTML 文档就绪可用时) 鼠标事件 click() 触发.或将函数绑定到指定元素的 click 事 ...
- 原生JS元素怎么取消事件
关于原生JS元素怎么取消事件,有3种方式 常规方法:removeEventListener 案例: <body> <div id="myDIV"> div ...
- 原生JS取代一些JQuery方法的简单实现
原生JS取代一些JQuery方法的简单实现 下面小编就为大家带来一篇原生JS取代一些JQuery方法的简单实现.小编觉得挺不错的,现在就分享给大家,也给大家做个参考.一起跟随小编过来看看吧 1.选 ...
- 原生js移动端touch事件实现上拉加载更多
大家都知道jQuery里没有touch事件,所以在移动端使用原生js实现上拉加载效果还是很不错的,闲话不多说,代码如下: //获取要操作的元素 var objSection = document.ge ...
- 原生js绑定和解绑事件,兼容IE,FF,chrome
主要是最近项目中用到了原生的js 解绑和绑定 事件 然后今天研究了一下,其实问题不大,不过要注意不要把单词写错了,今天我就找了好久单词写错了. 需求:当鼠标移上去以后,给Select加载元素,接着解 ...
- 近期学习的原生JS知识以及jQuery框架
[正则表达式]1.正则表达式包括两部分: ① 定义正则表达式的规则 ② 定义正则表达式的模式(i/g/m)2.声明正则表达式: ① 字面声明 : var reg = /表达式规则/表达式模式 ② 使用 ...
- 轮播图原生js实现和jquery实现和js面向对象方式实现
原生JS实现 html: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...
- JQuery的事件委托;jQuery注册事件;jQuery事件解绑
一.事件 ①事件委托:就是给子元素的父元素或者祖先元素注册一个事件,但是事件的执行者是子元素,委托事件的好处是能够给动态创建出来时元素也加上事件. ②简单事件:就是给自己注册事件自己执行动态创建出来的 ...
- 原生JS版和jQuery 版实现文件上传功能
<!doctype html> <html lang="zh"> <head> <meta charset="utf-8&quo ...
随机推荐
- 前端学习 第五弹: CSS (一)
前端学习 第五弹: CSS (一) 创建css: <link rel="stylesheet" type="text/css" href="my ...
- 安卓开发学习历程1——《第一行代码》coolweather项目setOnItemClickListener函数,Sql语句修改对模拟app程序机影响
今天,将<第一行代码>最后实战的coolweather项目,认真做了一遍. 今晚,在书中第一阶段开发代码认眞在Android studio敲完,发现setOnItemClickListen ...
- [THINKING IN JAVA]复用类
7 复用类 7.1 组合 即在一个类中使用另一个类作为成员变量,这是复用了现有程序代码的功能,而非形式. 7.2 继承 关键字:extends,这种复用是形式的复用,是一种可扩展和限制的复用: 复用: ...
- Qt开发中的实用笔记二--中文转码问题和string转换问题:
一,中文乱码转码问题 1,转码三句话:window下默认是GBK格式,linux下默认是UTF-8,看情况转换UTF-8/GBK QTextCodec::setCodecForTr(QTextCode ...
- 使用 dynamic 标记解析JSON字符串 JDynamic :支持Json反序列化为Dynamic对象
使用 dynamic 标记解析JSON字符串 http://www.cnblogs.com/taotaodetuer/p/4171327.html 1 string jsonStr = " ...
- kylin(一): 原理架构
由eBay开源的一个大数据OLAP框架,2014年11月加入了Apache,项目名字也改成了"Apache Kylin",Apache Kylin是唯一来自中国的Apache顶级开 ...
- Nim Game,Reverse String,Sum of Two Integers
下面是今天写的几道题: 292. Nim Game You are playing the following Nim Game with your friend: There is a heap o ...
- 怎么查看bios版本
怎么查看bios版本呢?无需去注册表查看,无需去BIOS中查看,只需要一条简单的命令即可,下面就来一起看一看怎么查看bios版本: Win键+R打开“运行”,然后再“运行”中输入cmd进而打开“cmd ...
- 记一次故障处理----主机异常关闭后mongodb二进制文件损坏
今天,在某个演示环境中,我们的产品经历过整个机房断电后,出现了mongodb二进制文件损坏,以下是故障的分析记录过程: 1.在客户处支撑的同事发现整个机房断电再恢复后,3个mongodb复制集中,有1 ...
- PHP如何通过CURL上传文件
PHP使用CURL上传文件只需发送一个POST请求就可以了,在请求中设置某个字段为需要上传的文件全路径,并且以“@”开头,然后使用CURL把该变量以POST方式发送到服务器,在服务端即可以从超级全局变 ...