jQuery实现的事件绑定功能基本示例


Posted in jQuery onOctober 11, 2017

本文实例讲述了jQuery实现的事件绑定功能。分享给大家供大家参考,具体如下:

HTML正文:

用户名:<input type="text" value="邮箱/用户名/手机号" id="login"/><br>
密 码:<input type="password" id="passwd"><br>
<input type="button" value="登陆" id="operation"/>

Javascript操作代码:

//获取焦点事件
$("#login").focus(function(){
 var $realValue=$(this).val();
 var $defaultVale=this.defaultValue;
 if($realValue==$defaultVale){
  $(this).val("");
 }else{
  $(this).val($realValue);
 }
});
//失去焦点事件
$("#login").blur(function(){
 var $realValue=$(this).val();
 var $defaultVale=this.defaultValue;
 if($realValue==""){
  $(this).val($defaultVale);
 }else{
  $(this).val($realValue);
 }
});
//登陆绑定事件:实际项目中一般使用md5进行单向加密,然后传递后台验证身份
$("#operation").click(function(){
var $realValue=$("#login").val();
var $passwd=$("#passwd").val();
if($realValue=="squirrel"||$passwd=="xiaoyang"){
  alert("验证成功");
}else{
  alert("验证失败");
}
});

效果:

jQuery实现的事件绑定功能基本示例

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
jQuery表单验证之密码确认
May 22 jQuery
jQuery导航条固定定位效果实例代码
May 26 jQuery
使用jQuery实现动态添加小广告
Jul 11 jQuery
详解jQuery中关于Ajax的几个常用的函数
Jul 17 jQuery
jQuery完成表单验证的实例代码(纯代码)
Sep 30 jQuery
jQuery实现的鼠标滚轮控制图片缩放功能实例
Oct 14 jQuery
jQuery实现鼠标点击处心形漂浮的炫酷效果示例
Apr 12 jQuery
jQuery实现table表格checkbox全选的方法分析
Jul 04 jQuery
jQuery访问json文件中数据的方法示例
Jan 28 jQuery
jQuery实现的隔行变色功能【案例】
Feb 18 jQuery
jQuery+ajax实现批量删除功能完整示例
Jun 06 jQuery
解决JQuery全选/反选第二次失效的问题
Oct 11 #jQuery
jQuery实现的form转json经典示例
Oct 10 #jQuery
认识jQuery的Promise的具体使用方法
Oct 10 #jQuery
jQuery实现获取table中鼠标click点击位置行号与列号的方法
Oct 09 #jQuery
jQuery插件artDialog.js使用与关闭方法示例
Oct 09 #jQuery
jQuery实现html双向绑定功能示例
Oct 09 #jQuery
jqueryUI tab标签页代码分享
Oct 09 #jQuery
You might like
通过ODBC连接的SQL SERVER实例
2006/10/09 PHP
php面向对象全攻略 (六)__set() __get() __isset() __unset()的用法
2009/09/30 PHP
PHP array操作10个小技巧分享
2011/06/23 PHP
体育彩票排列三组选三算法分享
2014/03/07 PHP
destoon实现底部添加你是第几位访问者的方法
2014/07/15 PHP
PHP单链表的实现代码
2016/07/05 PHP
浅谈PHP错误类型及屏蔽方法
2017/05/27 PHP
JavaScript 字符编码规则
2009/05/04 Javascript
javascript简单事件处理和with用法介绍
2013/09/16 Javascript
JavaScript创建闭包的两种方式的优劣与区别分析
2015/06/22 Javascript
JavaScript简单下拉菜单实例代码
2015/09/07 Javascript
javascript简单判断输入内容是否合法的方法
2016/05/11 Javascript
jQuery实现简单漂亮的Nav导航菜单效果
2017/03/29 jQuery
ReactNative中使用Redux架构总结
2017/12/15 Javascript
Bootstarp在pycharm中的安装及简单的使用方法
2019/04/19 Javascript
微信小程序云开发实现数据添加、查询和分页
2019/05/17 Javascript
js事件触发操作实例分析
2019/06/21 Javascript
ES6 Symbol数据类型的应用实例分析
2019/06/26 Javascript
Vue 实现分页与输入框关键字筛选功能
2020/01/02 Javascript
js+audio实现音乐播放器
2020/09/13 Javascript
python如何在终端里面显示一张图片
2016/08/17 Python
Python读取sqlite数据库文件的方法分析
2017/08/07 Python
python使用socket创建tcp服务器和客户端
2018/04/12 Python
python实现多线程网页下载器
2018/04/15 Python
Python lambda表达式用法实例分析
2018/12/25 Python
深入了解Python在HDA中的应用
2019/09/05 Python
Pandas操作CSV文件的读写实现方法
2019/11/13 Python
Office DEPOT法国官网:欧迪办公用品采购
2018/01/03 全球购物
女儿十岁生日答谢词
2014/01/27 职场文书
法律专业求职信
2014/05/24 职场文书
教师批评与自我批评剖析材料
2014/10/16 职场文书
客房服务员岗位职责
2015/02/09 职场文书
仓管员岗位职责范本
2015/04/01 职场文书
Vue通过懒加载提升页面响应速度
2021/05/10 Vue.js
pytorch 运行一段时间后出现GPU OOM的问题
2021/06/02 Python
Nginx如何配置多个服务域名解析共用80端口详解
2022/09/23 Servers