需求：点击需求：点击添加标签，出来input框，内容输入完成后点击enter键和blur时都可以执行提交标签的效果，提交时对内容进行判断，执行完成后清除input内的内容。如下图

问题：内容输入完成后blur事件执行没有问题，但是keypress时会先执行keypress然后在执行blur，因前一个事件执行后input框情况，blur执行时会告知用户未输入内容，导致体验极差。
解决：好吧，写到这里我发现我错了，因为始终都会执行blur函数，我直接只写一个blur事件就好了啊，啊啊啊，痛苦，想了那么多就这么简单。
其他：但是如果keypress 和 blur 要执行的内容不一样的话，可以加个定时器来解决这个问题

keypress 和 blur 事件冲突的问题的更多相关文章

  1. jquery点击click事件和blur事件冲突如何解决

    最近做了一个查询小功能,input输入框输入文字后,自动列出几条查询结果,可以键盘上下键或鼠标进行查询结果选择,并且点击输入框其他地方要隐藏这个列出的结果. 但比较头疼的是input上添加blur事件 ...

  2. click和blur事件冲突解决方案

    场景:例如做一个模仿百度搜索的搜索框,输入文字下面会有匹配项,当点击下拉项中的值时,就将值添加到搜索框中同时隐藏下拉框,点击其他地方就直接隐藏下拉框,这时所需要的事件分别为 下拉框事件onclick, ...

  3. blur和click事件冲突

    一.问题描述文本框的blur事件和div元素的click事件出现冲突.在input的blur事件中,我们隐藏div元素.在div的click事件中,我们清除input的内容,并隐藏自身.当我们在inp ...

  4. 下拉选择的blur和click事件冲突了

    当写个下拉选择框时我们希望当input失去焦点时,下拉框消失,或者当选择下拉框中的内容的同时将内容填入input并且使下拉框消失. 这时候我们会想到blur和click,单独使用的时候是没有问题的,但 ...

  5. input中blur失去焦点事件与点击事件冲突时如何解决

    方法一 使用setTimeout $(function(){ $(".cy-name-input input").on({ focus:function() { $(". ...

  6. Web页面多对象多文档事件冲突的解决方案

    这段时间写了很多基于js和jquery的前端控件,每一个的功能都很复杂,事件也很多. 因为都是单独封装的,单独使用没有问题,但把他们放到一个页面使用,就经常发生事件冲突的问题. 这几天一直在考虑用一个 ...

  7. webview滑动事件 与内部html左右滑动事件冲突问题的解决办法

    最近在做个混合app , 用html做页面,然后通过webview嵌套在activity中,效果是这样: 开始还是比较顺利,增加了菜单退出按钮,返回键页面回退功能,页面加载显示加载图标(在app端实现 ...

  8. input 的blur事件之后button的onclick事件不执行解决方案

    最近发现网页程序中有个BUG,就是在input标签输入框中输入完数据后,直接点击“取消” 按钮的时候.出现网页崩死的情况: 经过小主酸菜我,各种方法的尝试后,找到一个初步可以解决的方案,在这里分享给大 ...

  9. 说说focus /focusin /focusout /blur 事件

    事件触发时间 focus:当focusable元素获得焦点时,不支持冒泡:focusin:和focus一样,只是此事件支持冒泡:blur:当focusable元素失去焦点时,不支持冒泡:focusou ...

随机推荐

  1. 项目spring boot 写es hbase 运行内存溢出

    本地项目运行正常.服务器上运行内存溢出. 项目内部同时做插入oracle,es,hbase 经过测试发现 同时插入es,hbase是服务器上就会出现内存溢出 如果只插入oracle+es 或oracl ...

  2. 基于UGUI的框架

    这个框架简单易懂,上手就可以直接拿来用,主要是单例管理类,界面和界面之间的互相交流通过单例去实现,个人感觉不是很好,但是我特别喜欢他的管理层级非常分明. 之后会发一个广播机制,结合上这套UI框架,但是 ...

  3. C++智能指针类型转换

    #include <iostream> #include <memory> struct Base { int a; virtual void f() const { std: ...

  4. python中小整数对象池及intern机制

    小整数对象池: Python为了优化速度,使用了小整数对象池,避免为整数频繁申请和销毁 Python 对小整数的定义是 [-5, 256] 这些整数对象是提前建立好的,不会被垃圾回收,所有位于这个范围 ...

  5. 学习笔记30_ORM框架

    *在以往DAL层中,操作数据库使用DataTable,如果使得数据表DataTable转为List<>的话,写错属性名,在编译阶段是查不出来的,而ORM框架能解决此问题. *ORM是指面向 ...

  6. python分支和循环结构

    本文收录在Python从入门到精通系列文章系列 1. 分支结构 1.1 应用场景 迄今为止,我们写的Python代码都是一条一条语句顺序执行,这种代码结构通常称之为顺序结构.然而仅有顺序结构并不能解决 ...

  7. 使用Typescript重构axios(六)——实现基础功能：获取响应数据

    0. 系列文章 1.使用Typescript重构axios(一)--写在最前面 2.使用Typescript重构axios(二)--项目起手,跑通流程 3.使用Typescript重构axios(三) ...

  8. svg路径蒙版动画

    svg路径蒙版动画,是比较实用的一种动画效果,能够绘制如下图所示的动画. 接下来细说这样的动画是如何做成的: 1.准备工作 2.SVG路径动画 3.SVG路径蒙版动画 4.复杂图形的编辑技巧 1.准备 ...

  9. 『题解』洛谷P5015 标题统计

    题意描述 给你一个字符串,求所有字符的总数. 字符只包含数字,大小写字母. 分析 字符串的长度还是\(\le5\)的. 直接枚举就可以了. AC代码: NOIP官方标准程序是这样的 #include ...

  10. jquery设置html5音量的方法

    jquery设置html5音量的方法<pre> setTimeout(function() { alert(1); $('#music1')[0].volume = 0; setTimeo ...