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中关于bind()方法的使用技巧分享
Mar 30 jQuery
jQuery Tree Multiselect使用详解
May 02 jQuery
解决jQuery ajax动态新增节点无法触发点击事件的问题
May 24 jQuery
jQuery实现手势解锁密码特效
Aug 14 jQuery
jquery之基本选择器practice(实例讲解)
Sep 30 jQuery
jquery获取元素到屏幕四周可视距离的方法
Sep 05 jQuery
jQuery Ajax实现Select多级关联动态绑定数据的实例代码
Oct 26 jQuery
jquery插件开发模式实例详解
Jul 20 jQuery
jquery树形插件zTree高级使用详解
Aug 16 jQuery
jquery选择器和属性对象的操作实例分析
Jan 10 jQuery
jQuery 函数实例分析【函数声明、函数表达式、匿名函数等】
May 19 jQuery
jQuery 动画与停止动画效果实例详解
May 19 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逐行读取txt文件写入数组的方法
2015/07/02 PHP
php 读取文件夹下所有图片、文件的实例
2018/10/17 PHP
javascript:void(0)是什么意思示例介绍
2013/11/17 Javascript
Javascript正则控制文本框只能输入整数或浮点数
2014/09/02 Javascript
Javascript模拟加速运动与减速运动代码分享
2014/12/11 Javascript
jQuery 和 CSS 的文本特效插件集锦
2014/12/12 Javascript
js中键盘事件实例简析
2015/01/10 Javascript
jquery获取多个checkbox的值异步提交给php
2015/07/07 Javascript
jQuery实现带有动画效果的回到顶部和底部代码
2015/11/04 Javascript
JavaScript组成、引入、输出、运算符基础知识讲解
2016/12/08 Javascript
AngulaJS路由 ui-router 传参实例
2017/04/28 Javascript
什么是Vue.js框架 为什么选择它?
2017/10/17 Javascript
深入理解JavaScript的值传递和引用传递
2018/10/24 Javascript
写gulp遇到的ES6问题详解
2018/12/03 Javascript
解决前后端分离 vue+springboot 跨域 session+cookie失效问题
2019/05/13 Javascript
[01:17:12]职来职往完美电竞专场
2014/09/18 DOTA
python3音乐播放器简单实现代码
2020/04/20 Python
Python+Selenium+PIL+Tesseract自动识别验证码进行一键登录
2017/09/20 Python
tensorflow实现逻辑回归模型
2018/09/08 Python
python 检查文件mime类型的方法
2018/12/08 Python
python自动发邮件总结及实例说明【推荐】
2019/05/31 Python
python 进程的几种创建方式详解
2019/08/29 Python
Django2 连接MySQL及model测试实例分析
2019/12/10 Python
利用keras加载训练好的.H5文件,并实现预测图片
2020/01/24 Python
Tensorflow 多线程与多进程数据加载实例
2020/02/05 Python
深入浅析python 中的self和cls的区别
2020/06/20 Python
幼儿园保育员辞职信
2014/01/12 职场文书
《三亚落日》教学反思
2014/04/26 职场文书
2014年学习委员工作总结
2014/11/14 职场文书
学习雷锋精神活动总结
2015/02/06 职场文书
2015年售票员工作总结
2015/04/29 职场文书
PHP基本语法
2021/03/31 PHP
Java Shutdown Hook场景使用及源码分析
2021/06/15 Java/Android
详解Java分布式事务的 6 种解决方案
2021/06/26 Java/Android
spring boot中nativeQuery的用法
2021/07/26 Java/Android
SQL使用复合索引实现数据库查询的优化
2022/05/25 SQL Server