jQuery 前的按键判断代码
作者:bea
做web开发的时候,有时候需要根据键盘进行一些操作,例如按下Enter的时候提交表单,禁止用户输入某些特殊字符,设置快捷键等等。这时候需要找出用户按下的是那些按键,写个小程序来测试按键。 代码如下: $(document).ready(function(){ var $down = $("#down"); var $press = $("#press"); var $up = $("#up"); $(document).keydown(function(event)
做web开发的时候,有时候需要根据键盘进行一些操作,例如按下Enter的时候提交表单,禁止用户输入某些特殊字符,设置快捷键等等。这时候需要找出用户按下的是那些按键,写个小程序来测试按键。
代码如下:
$(document).ready(function(){
var $down = $("#down");
var $press = $("#press");
var $up = $("#up");
$(document).keydown(function(event){
$down.append(String.fromCharCode(event.keyCode) + " ");
if (event.ctrlKey) {
alert("ctrl");
}
}).keyup(function(event){
$up.append(String.fromCharCode(event.keyCode) + " ");
}).keypress(function(event){
$press.append(String.fromCharCode(event.keyCode) + " ");
});
});
方法是触发down时,把keyCode push到数组里,并删除重复元素;触发up时,用$.grep从数组中删除该keyCode。
在任意时刻,这个数组里都保存了当前所按的按键,并且顺序是根据按键顺序排列的。
用jQuery判断当前所按的按键
方法就是用一个外部的数组保存当前按键。
在触发keydown时,把keyCode push到数组里,并删除重复元素;触发keyup时,用$.grep从数组中删除该keyCode。
实现代码如下:
代码如下:
当前按键:<span id="msg"></span>
<script type="text/javascript">
Array.prototype.unique = function () { //这个是删除重复元素用的,可惜$.unique只能处理DOM数组。
var o = {};
for (var i = 0, j = 0; i < this.length; ++i) {
if (o[this[i]] === undefined) {
o[this[i]] = j++;
}
}
this.length = 0;
for (var key in o) {
this[o[key]] = key;
}
return this;
};
var $msg = $('#msg');
var keys = [];
$(document).keydown(function(event){
keys.push(event.keyCode);
keys.unique();
$msg.html(keys.join(' '));
}).keyup(function(event){
keys.push(event.keyCode);
keys = $.grep(keys, function (n) {return n != event.keyCode;});
$msg.html(keys.join(' '));
});
</script>
有用 | 无用
代码如下:
$(document).ready(function(){
var $down = $("#down");
var $press = $("#press");
var $up = $("#up");
$(document).keydown(function(event){
$down.append(String.fromCharCode(event.keyCode) + " ");
if (event.ctrlKey) {
alert("ctrl");
}
}).keyup(function(event){
$up.append(String.fromCharCode(event.keyCode) + " ");
}).keypress(function(event){
$press.append(String.fromCharCode(event.keyCode) + " ");
});
});
方法是触发down时,把keyCode push到数组里,并删除重复元素;触发up时,用$.grep从数组中删除该keyCode。
在任意时刻,这个数组里都保存了当前所按的按键,并且顺序是根据按键顺序排列的。
用jQuery判断当前所按的按键
方法就是用一个外部的数组保存当前按键。
在触发keydown时,把keyCode push到数组里,并删除重复元素;触发keyup时,用$.grep从数组中删除该keyCode。
实现代码如下:
代码如下:
当前按键:<span id="msg"></span>
<script type="text/javascript">
Array.prototype.unique = function () { //这个是删除重复元素用的,可惜$.unique只能处理DOM数组。
var o = {};
for (var i = 0, j = 0; i < this.length; ++i) {
if (o[this[i]] === undefined) {
o[this[i]] = j++;
}
}
this.length = 0;
for (var key in o) {
this[o[key]] = key;
}
return this;
};
var $msg = $('#msg');
var keys = [];
$(document).keydown(function(event){
keys.push(event.keyCode);
keys.unique();
$msg.html(keys.join(' '));
}).keyup(function(event){
keys.push(event.keyCode);
keys = $.grep(keys, function (n) {return n != event.keyCode;});
$msg.html(keys.join(' '));
});
</script>
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- 简洁短小的 JavaScript IE 浏览器判定代码
- jQuery实现表单input中提示文字value随鼠标焦点移进移出而显示或隐藏的代码
- 锋利的jQuery jQuery中的DOM操作
- 锋利的jQuery 要点归纳(一) jQuery选择器
- jquery 可拖拽的窗体控件实现代码
- jquery实现的元素的left增加N像素 鼠标移开会慢慢的移动到原来的位置
- javascript qq右下角滑出窗口 sheyMsg
- js 居中漂浮广告
- jquery checkbox,radio是否选中的判断代码
- javascript中的new使用
- javascript 操作select下拉列表框的一点小经验
- js 格式化时间日期函数小结
- window.location.hash 属性使用说明
- 对 lightbox JS 图片控件进行了一下改造, 使其他支持复杂的图片说明
- js 强制弹出窗口代码研究-又一款代码
- js 数组克隆方法 小结
- vs2003 js文件编码问题的解决方法
- Jquery AutoComplete自动完成 的使用方法实例
- JavaScript 对象的属性和方法4种不同的类型