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插件FusionCharts绘制2D环饼图效果示例【附demo源码】
Apr 10 jQuery
jQuery动态追加页面数据以及事件委托详解
May 06 jQuery
jQuery 表单序列化实例代码
Jun 11 jQuery
jQuery扇形定时器插件pietimer使用方法详解
Jul 18 jQuery
jquery之基本选择器practice(实例讲解)
Sep 30 jQuery
jQuery简单实现对数组去重及排序操作实例
Oct 31 jQuery
jquery radio 动态控制选中失效问题的解决方法
Feb 28 jQuery
基于jQuery实现的设置文本区域的光标位置
Jun 15 jQuery
jQuery实现合并表格单元格中相同行操作示例
Jan 28 jQuery
jquery实现上传图片功能
Jun 29 jQuery
jQuery列表动态增加和删除的实现方法
Nov 05 jQuery
jQuery实现增删改查
Dec 22 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
PHP 中的一些经验积累
2006/10/09 PHP
PHP5 字符串处理函数大全
2010/03/23 PHP
linux下安装php的memcached客户端
2014/08/03 PHP
CI框架(CodeIgniter)公共模型类定义与用法示例
2017/08/10 PHP
处理及遍历XML文档DOM元素属性及方法整理
2013/08/23 Javascript
关于jQuery判断元素是否存在的问题示例探讨
2014/07/21 Javascript
一个jquery实现的不错的多行文字图片滚动效果
2014/09/28 Javascript
javascript显示倒计时控制按钮的简单实现
2016/06/07 Javascript
Angular.js自定义指令学习笔记实例
2017/02/24 Javascript
js每隔两秒输出数组中的一项(实例)
2017/05/28 Javascript
vue-router实现tab标签页(单页面)详解
2017/10/17 Javascript
详解性能更优越的小程序图片懒加载方式
2018/07/18 Javascript
mock.js模拟数据实现前后端分离
2019/07/24 Javascript
用原生JS实现爱奇艺首页导航栏代码实例
2019/09/19 Javascript
JavaScript 实现HTML DOM增删改查操作的常见方法详解
2020/01/04 Javascript
ES6使用新特性Proxy实现的数据绑定功能实例
2020/05/11 Javascript
ES6中的类(Class)示例详解
2020/12/09 Javascript
Python比较文件夹比另一同名文件夹多出的文件并复制出来的方法
2015/03/05 Python
浅析Python中MySQLdb的事务处理功能
2016/09/21 Python
200 行python 代码实现 2048 游戏
2018/01/12 Python
Python使用ctypes调用C/C++的方法
2019/01/29 Python
Python实现爬取亚马逊数据并打印出Excel文件操作示例
2019/05/16 Python
Python 中list ,set,dict的大规模查找效率对比详解
2019/10/11 Python
Python模拟登录之滑块验证码的破解(实例代码)
2019/11/18 Python
python利用faker库批量生成测试数据
2020/10/15 Python
RIP版本1跟版本2的区别
2013/12/30 面试题
计算机科学系职业生涯规划书
2014/03/08 职场文书
大学生全国两会报告感想
2014/03/17 职场文书
阳光体育活动总结
2014/04/30 职场文书
关于责任的演讲稿
2014/05/20 职场文书
课堂打架检讨书200字
2014/11/21 职场文书
2015年副班长工作总结
2015/05/15 职场文书
师范生教育见习总结
2015/06/23 职场文书
公司岗位说明书
2015/10/08 职场文书
Python趣味挑战之用pygame实现简单的金币旋转效果
2021/05/31 Python
GTX1660显卡搭配显示器推荐
2022/04/19 数码科技