场景描述:在做编辑功能的时候,经常要判断编码,或者密码之类的是否已经被使用,以前自己做的时候,经常都是在提交了之后才判断的,到现在,才发现,这样做的用户体验不好,完美一点的做法就是当此文本框失去焦点的时候,就直接给出提示,通过blur()来实现,上代码

代码:

//html代码
<input type="text" id="code" name="code"/>
//js代码
$("#code").blur(function () { // 监听文本框事件,判断编码是否存在
searchCode();
}); function searchCode() {
var code = $("#code").val();
var url = rootPath + "/vrx/xxx/searchCode";
var result = CommnUtil.ajax(url, {'code': code}, "json");
if (result == "true") {
layer.msg("编码已经存在,请重新输入!");
return "true";
} else if (result == "fail") {
layer.msg("查询编码失败,后台系统错误!");
} else if (result == "false") {
return "false";
}
return "fail";

后台代码就不写了,这是返回“true” "false" "fail" 字符串的,自己动手写吧

总结:以后对自己要求不能仅仅是完成功能,而应该贴近用户的体验,最了解产品模块的,不是产品经理,而是developer本身吧!

文本框监听事件blur()的简单使用的更多相关文章

  1. IE浏览器的脚本文本框监听事件

    一.IE8的文本框监听事件 由于在IE8所以input和propertychange都不能用,终于皇天不负有心人让我找到了这个:https://github.com/sophiebits/jquery ...

  2. jquery实时监听某个文本框的输入事件

    想给页面的的一个文本框添加监听事件 $(function(){ //页面加载完毕后触发事件 $("textarea[name='content']").bind('input pr ...

  3. UI设计篇·入门篇·简单动画的实现,透明动画/旋转动画/移动动画/缩放动画,混合动画效果的实现,为动画设置监听事件,自定义动画的方法

    基本的动画构成共有四种:透明动画/旋转动画/移动动画/缩放动画. 配置动画的方式有两种,一种是直接使用代码来配置动画效果,另一种是使用xml文档配置动画效果 相比而言,用xml文档写出来的动画效果,写 ...

  4. JS,JQ及时监听input值的变化,MUI的input搜索框里的清除按钮的点击监听事件

    JS: document.getElementById("input对象的ID").addEventListener('input',function(){ console.log ...

  5. jquery监听事件on写法以及简单的拖拽效果

    引子——关于jquery的某些写法 我先不对监听事件做解释,我们先来看下jquery的一些写法吧!我们最常用的是jquery的css()方法,相信大家都会用! 假如用css设置一个属性,我们写法如下: ...

  6. jquery中,使用append增加元素时,该元素的绑定监听事件失效

    举例:如果在一个<div id="resultArea"></div>中,通过append添加一个id="checkOutTip"的文本 ...

  7. JAVA JComboBox的监听事件(ActionListener、ItemListener)

    版权声明:本文为博主原创文章,未经博主允许不得转载.   目录(?)[+]   参考资料: http://263229365.iteye.com/blog/1040329 https://www.ja ...

  8. Android——监听事件总结

    各种监听事件 1.按钮 Button(1)点击监听 btn_1.setOnClickListener(new View.OnClickListener() { (2)长按监听 btn_1.setOnL ...

  9. DOM初体验(绑定事件,监听事件)

    JavaScript的组成: ECMAScript(js的基本语法).DOM(文档对象模型).BOM(浏览器对象模型) DOM的作用: 1. 找到页面上的元素 2. 增添.删除.修改页面上的元素 3. ...

随机推荐

  1. vue非父子组件之间的通信

    https://www.cnblogs.com/chengduxiaoc/p/7099552.html   //vm.$emit( event, arg ) //触发当前实例上的事件 //vm.$on ...

  2. CodeSmith如何生成实体类 ,完善版

    <%-- Name: Database Table Properties Author: Paul Welter Description: Create a list of properties ...

  3. python如何安装pip及venv管理

    问题1:如何安装pip python的虚拟环境virtualenv的管理 背景: (1)python的版本很多,每个应用项目可能需要使用不同的版本,这样会导致兼容性问题: python的插件相当的丰富 ...

  4. springboot +thymeleaf+myql 记录

    thymeleaf官方文档: https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.pdf demo案例:https://github. ...

  5. LODOP、C-Lodop简短排查语句

    https使用,故障:1.是https网站吗,https扩展版C-Lodop如何使用 参考http://www.c-lodop.com/faq/pp32.html2.双击桌面上的c-lodop快捷方式 ...

  6. JS 中的原型 -- prototype、__proto__ 以及原型链

    原文: 1.深入理解javascript原型和闭包——prototype原型 2.三张图搞懂JavaScript的原型对象与原型链 打开浏览器控制台,任意定义一个对象,打印出来后,会发现有最后一定有一 ...

  7. OTZ%%%子谦。大佬

    又上了节课...俩题 计算系数    组合数问题... 要不是大佬指点就只能阶乘暴力算了 (主要还是我忘了杨辉三角) 杨辉三角与组合数C有着千丝万缕的联系,在计算,使用方面相当方便. 先说计算系数 计 ...

  8. dl,dt,dd标签的使用

    dl就是定义一个列表 dt说明白了就是这个列表的标题dd就是内容,能缩进和UL,OL性质差不多 <dl> <dt>标题标题</dt> <dd>内容内容& ...

  9. ☆ [HNOI2012] 永无乡 「平衡树启发式合并」

    题目类型:平衡树启发式合并 传送门:>Here< 题意:节点可以连边(不能断边),询问任意两个节点的连通性与一个连通块中排名第\(k\)的节点 解题思路 如果不需要询问排名,那么并查集即可 ...

  10. 【XSY2843】「地底蔷薇」 NTT什么的 扩展拉格朗日反演

    题目大意 给定集合\(S\),请你求出\(n\)个点的"所有极大点双连通分量的大小都在\(S\)内"的不同简单无向连通图的个数对\(998244353\)取模的结果. \(n\le ...