Jquery 判断是否锁定大小写键插件
/**
* Caps Lock
* @since for example:$("#test").capsLockTip({width:"200px",text:"error"});
*/
(function($) {
var curID = 0;//
$.fn.extend({
capsLockTip : function(options) {
options = $.extend({}, $.CapsLockTip.defaults, options);
return this.each(function() {
new $.CapsLockTip($(this),options);
});
}
});
$.CapsLockTip = function(input,options) {
// 设置当前实例的配置参数。
var _this = this;
var width=options.width;// 设置自动完成框的宽度
width = width < $(input).width()?$(input).width():width;
var $input = $(input).attr("curCapsLockId", curID++);
var $div = $("#autocapsLock" + $input.attr("curCapsLockId")).length != 0 ? $("#autocapsLock"
+ $input.attr("curCapsLockId"))
: $("<div/>").attr("id",
"autocapsLock" + $input.attr("curCapsLockId")).css({
"padding-top" : "3px",
position : "absolute",
"z-index" : "99999"
}).css("width",width)
.css("left", $input.offset().left + "px")
.css("top", $input.offset().top + $input.offsetHeight + 3 + "px")
.appendTo("body").text(options.text).hide();
if(!$div.attr("class")&&options.styleClass){
$div.addClass(options.styleClass);
}else{
$div.css({color : "red",
"font-size" : "12px",
border : "solid 1px #DBC492",
"border-bottom-color" : "#B49366",
"border-right-color" : "#B49366"});
}
$input.bind("keypress", function(_event) {
var e = _event || window.event;
var kc = e.keyCode || e.which;// 按键的keyCode
var isShift = e.shiftKey || (kc == 16) || false;// shift键是否按住
$.fn.capsLockTip.capsLockActived = false;
if ((kc >= 65 && kc <= 90 && !isShift)
|| (kc >= 97 && kc <= 122 && isShift))
$.fn.capsLockTip.capsLockActived = true;
_this.showTips($.fn.capsLockTip.capsLockActived);
});
$input.bind("keydown",function(_event) {
var e = _event || window.event;
var kc = e.keyCode || e.which;
if (kc == 20&& null != $.fn.capsLockTip.capsLockActived) {
$.fn.capsLockTip.capsLockActived = !$.fn.capsLockTip.capsLockActived;
_this.showTips($.fn.capsLockTip.capsLockActived);
}
});
$input.bind("focus", function(_event) {
if (null != $.fn.capsLockTip.capsLockActived)
_this.showTips($.fn.capsLockTip.capsLockActived);
});
$input.bind("blur", function(_event) {
_this.showTips(false);
});
//Show or hide the Caps Lock prompt.
this.showTips = function(display) {
if (display) {
$div.show();
} else {
$div.hide();
}
};
// Caps Lock key state
$.fn.capsLockTip.capsLockActived = null;
};
$.CapsLockTip.defaults = {
styleClass:"",//提示框样式class名称
width:0,//提示框宽度
text:"大写键已被锁定"//错误提示信息
};
})(jQuery);
分享到:
相关推荐
jQueryUI jQueryUI插件 键盘插件 基于 jQueryUI 的小键盘 可灵活修改
一种漂亮的jquery键盘插件。之前项目里面用到的。键盘效果还是很ok、的,有数字小键盘。还有全键盘
jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery....
jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件
使用jquery框架写的键盘插件,使用简单,方便。
jquery 插件jquery 插件jquery 插件jquery 插件
jQuery键盘插件网页虚拟键盘输入代码 jQuery键盘插件网页虚拟键盘输入代码
jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件
jquery实现父元素大小改变插件:jquery-resize
jquery插件库大全(200个): jqueryQQ表情插件 jquery下拉菜单导航 jquery下拉菜单栏 jquery仿Windows系统选中图标效果 jquery仿京东商品详情页图片放大效果 jquery仿百度新闻焦点轮播 jquery分离布局模版 jquery...
Jquery图片放大查看插件,根据图片大小显示,滚动放大缩小,可前后切换图片
jQuery模拟键盘打字插件typetype是一款jQuery插件,模拟人的打字动画效果。
jquery-font-size-event.js是一款jquery设置字体大小插件。通过该jquery插件,你可以动态修改网页中指定区域的字体大小。
组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件...
一款基于jQuery车牌输入插件,网上找到的,自己用着挺好的,分享给大家!
jQuery官方UI插件 jQuery官方UI插件 jQuery官方UI插件 jQuery官方UI插件
jQuery方向键控制翻页插件是一款可用方向键控制翻页的数字分页插件jquery.keyboard-pagination。
jsontree (jquery.treeview.js) jQuery插件版 treeview1.0jsontree (jquery.treeview.js) jQuery插件版 treeview1.0jsontree (jquery.treeview.js) jQuery插件版 treeview1.0jsontree (jquery.treeview.js) jQuery...
jquery表单验证插件
jquery树形插件jquery树形插件jquery树形插件jquery树形插件jquery树形插件jquery树形插件 非常美观,功能强大,代码简单易读