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

 更新时间:2017年10月11日 10:14:59   作者:Zerone1993  
这篇文章主要介绍了jQuery实现的事件绑定功能,结合简单表单验证实例分析了jQuery事件绑定的实现与使用方法,需要的朋友可以参考下

本文实例讲述了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操作json数据技巧汇总》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》及《jquery选择器用法总结

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

相关文章

  • jQuery开发者都需要知道的5个小技巧

    jQuery开发者都需要知道的5个小技巧

    JQuery是个不错的框架,以下总结了5个每个网站开发者都应该知道的小技巧,都是一些非常不错的,经常能用得到的。
    2010-01-01
  • jquery制作LED 时钟特效

    jquery制作LED 时钟特效

    这篇文章主要介绍了jquery制作LED 时钟特效,效果非常不错,需要的朋友可以参考下
    2015-02-02
  • jQuery获得内容和属性方法及示例

    jQuery获得内容和属性方法及示例

    获得内容的三个简单实用的方法text()、html() 以及 val()、获取属性的attr()方法,下面有个不错的示例,感兴趣的朋友可以参考下
    2013-12-12
  • Jquery取得iframe下内容的方法

    Jquery取得iframe下内容的方法

    这篇文章主要介绍了Jquery取得iframe下内容的方法,有需要的朋友可以参考一下
    2013-11-11
  • jQuery 选择器用法基础入门示例

    jQuery 选择器用法基础入门示例

    这篇文章主要介绍了jQuery 选择器用法,结合实例形式详细分析了jQuery选择器的基本功能、使用方法及操作注意事项,需要的朋友可以参考下
    2020-01-01
  • jQuery webuploader分片上传大文件

    jQuery webuploader分片上传大文件

    这篇文章主要为大家详细介绍了jQuery webuploader分片上传大文件的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-11-11
  • javascript与jquery中跳出循环的区别总结

    javascript与jquery中跳出循环的区别总结

    本文是对javascript与jquery中跳出循环的区别进行了详细的总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2013-11-11
  • jQuery+ajax实现文章点赞功能的方法

    jQuery+ajax实现文章点赞功能的方法

    这篇文章主要介绍了jQuery+ajax实现文章点赞功能的方法,涉及jQuery基于ajax无刷新post提交实现点赞功能的具体步骤与相关技巧,需要的朋友可以参考下
    2015-12-12
  • 基于JQuery 的消息提示框效果代码

    基于JQuery 的消息提示框效果代码

    本身不熟悉js略懂JQuery,闲着没事帮朋友公司一个程序小伙修改了个消息提示框,把修改后的代码和代价分享一下
    2011-07-07
  • jQuery DOM操作实例

    jQuery DOM操作实例

    本文用代码的方式详细讲解了jQuery的DOM操作,具体操作方法请详细参看代码中的注释部份
    2014-03-03

最新评论