jquery插件--在input下输入密码时提示大写锁定键
//密码大写输入提示
function capitalTip(id){
$('#' + id).after('<div class="capslock" id="capital_password"><span>大写锁定已开启</span></div>');
var capital = false; //聚焦初始化,防止刚聚焦时点击Caps按键提示信息显隐错误 // 获取大写提示的标签,并提供大写提示显示隐藏的调用接口
var capitalTip = {
$elem: $('#capital_'+id),
toggle: function (s) {
if(s === 'none'){
this.$elem.hide();
}else if(s === 'block'){
this.$elem.show();
}else if(this.$elem.is(':hidden')){
this.$elem.show();
}else{
this.$elem.hide();
}
}
}
$('#' + id).on('keydown.caps',function(e){
if (e.keyCode === 20 && capital) { // 点击Caps大写提示显隐切换
capitalTip.toggle();
}
}).on('focus.caps',function(){capital = false}).on('keypress.caps',function(e){capsLock(e)}).on('blur.caps',function(e){ //输入框失去焦点,提示隐藏
capitalTip.toggle('none');
});
function capsLock(e){
var keyCode = e.keyCode || e.which;// 按键的keyCode
var isShift = e.shiftKey || keyCode === 16 || false;// shift键是否按住
if(keyCode === 9){
capitalTip.toggle('none');
}else{
//指定位置的字符的 Unicode 编码 , 通过与shift键对于的keycode,就可以判断capslock是否开启了
// 90 Caps Lock 打开,且没有按住shift键
if (((keyCode >= 65 && keyCode <= 90) && !isShift) || ((keyCode >= 97 && keyCode <= 122) && isShift)) {
// 122 Caps Lock打开,且按住shift键
capitalTip.toggle('block'); // 大写开启时弹出提示框
capital = true;
} else {
capitalTip.toggle('none');
capital = true;
}
}
}
};
再来看效果

测试地址: http://sms.reyo.cn 用户名:aa 密码:123456
jquery插件--在input下输入密码时提示大写锁定键的更多相关文章
- 发布一个在Web下输入密码时提示大写锁定键的Jquery插件
功能介绍:在Web下输入密码时提示大写锁定键,封装成jq插件方便有需要的同学!使用:$("#txtPWD").capsLockTip();截图预览:代码(2012-05-03 10 ...
- jQuery实现当按下回车键时绑定点击事件
jQuery实现当按下回车键时绑定点击事件 <script> $(function(){ $(document).keydown(function(event){ if(event.key ...
- Ubuntu下安装软件提示无法锁定管理目录(/var/lib/dpkg/)的解决办法
Ubuntu下安装软件提示无法锁定管理目录(/var/lib/dpkg/)的解决办法 在安装软件的时候,有时候提示,无法锁定管理目录(/var/lib/dpkg/),是否有其他进程正占用它? 这是 ...
- jquery插件artTxtCount输入字数限制,并提示剩余字数
工作中用到,需要批量处理下 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http ...
- jQuery插件实现select下拉框左右选择_交换内容(multiselect2side)
效果图: 使用jQuery插件---multiselect2side做法: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitio ...
- jquery插件制作,下拉菜单
要求输入框点击出现下拉菜单,并实现以下功能: 1.首先点击地点标签页,选择好地点: 2.自动显示相应节点标签页显示节点信息,选择好节点 3.自动显示相应的连接点,选择连接点,连接点被选中并被传送的输入 ...
- SVN下载时提示“已经锁定”
问题现象:同事让我提交代码,我就先下载后提交,但下载时提示“D:\ABC”已经锁定. 问题原因:原因不明. 问题处理:向上退一级,右击目录->SVN->"清理"-> ...
- jquery中当CheckBoxList被选中时提示
$(function(){ $('input:checkbox').on('change', function(){ //当复选框选中时出现提示 if($('input:checkbox:checke ...
- MDK下调试时提示AXF文件无法导入的解决方法(转)
源:http://blog.163.com/zhaojun_xf/blog/static/3005058020117784643555/ 在开发ARM项目中,很多工程师都不太喜欢使用MDK的调试模式, ...
随机推荐
- High-Speed Tracking with Kernelized Correlation Filters
2015年的一篇论文,可参考:http://blog.csdn.net/carrierlxksuper/article/details/46461245. 另参考:http:// ...
- JavaScript之this学习心得
this在运行时绑定,并不是在编写时绑定,它的上下文取决于函数调用的各种条件.this既不指向自身,也不指向函数的词法作用域.this是在函数被调用时发生的绑定,指向什么完全取决于函数在哪里被调用. ...
- Smarty 模板引擎简介
前言 Smarty是一个使用PHP写出来的模板引擎,是目前业界最著名的PHP模板引擎之一.它分离了逻辑代码和外在的内容,提供了一种易于管理和使用的方法,用来将原本与HTML代码混杂在一起PHP代码逻辑 ...
- [java笔记]JDK的安装和配置
1.JDK安装下载java JDK:点击下载(http://www.oracle.com/technetwork/java/javase/downloads/index.html )JDK(Java ...
- 【linux】crontab无效解决办法
参考来源:http://www.tennfy.com/3088.html 问题: 我在crontab中添加了一条定时任务 * * * sh test.sh 出乎意料的是,该定时任务并没有执行.可是我直 ...
- java JVM指令2
https://www.cnblogs.com/dreamroute/p/5089513.html 指令码 助记符 说明 0x00 nop 什么都不做 0x01 aconst_null 将null推送 ...
- laravel 5.1 Model 属性详解
<?php namespace Illuminate\Database\Eloquent; /** * 下面提到某些词的含义: * 1.覆盖: 在继承该类 \Illuminate\Databas ...
- Java中 equals 和 == 的比较
先来看这样一个题目,假设有以下代码 下列选项中返回false的语句是? String s = "hello"; String t = "hello"; char ...
- python的mock功能,感觉入门了~~~
主要实现语法有patch, patch.object, Mock(). 下面的测试太赤裸裸了,只是为了熟悉语法. import unittest from unittest.mock import p ...
- vuejs递归组件
vuejs学习--递归组件 前言 学习vue有一段时间了,最近使用vue做了一套后台管理系统,其中使用最多就是递归组件,也因为自己对官方文档的不熟悉使得自己踩了不少坑,今天写出来和大家一起分享. ...