Home » jQuery 外掛

[jQ]HotKeys 0.8

範例 1
沒錯!只要 500 元就能獲得我們團隊完整的協助,讓效果能迅速的整合到您的網站,並保證瀏覽器的相容性。
立刻申請!

HotKeys 0.7.9

Gmail 本身就提供了蠻多讓使用者能快速使用的熱鍵功能,讓操作網頁就像是操作 Windows 應用程式一樣。現在有了 HotKeys 就能快速的幫網頁加上熱鍵的功能。透過這樣的熱鍵功能也能運用在網頁遊戲上唷!

HotKeys 目前僅支援 keydownkeyupkeypress 等事件。

套件名稱:HotKeys
套件版本:0.8
作者網站:http://code.google.com/p/js-hotkeys
套件網址:http://plugins.jquery.com/project/hotkeys
發佈日期:2010-02-22
檔案大小:3.0 KB
檔案下載:jquery.hotkeys.js

方法說明:

檢視原始碼 JavaScript
1
2
3
4
5
// 替指定的熱鍵加上指定的事件; options 可以只有熱鍵值或是進階的觸發參數, 例如: {combi:'Ctrl+x', disableInInput: true}, combi 為熱鍵值, disableInInput 則表示是否取消熱鍵在輸入框的作用
$(selector).bind(types[, options], handler);
 
// 替指定的熱鍵加上指定的事件; options 可以只有熱鍵值或是進階的觸發參數, 例如: {combi:'Ctrl+x', disableInInput: true}, combi 為熱鍵值, disableInInput 則表示是否取消熱鍵在輸入框的作用
$(selector).unbind([types][, options][, handler]);

使用範例:

檢視原始碼 JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.hotkeys.js"></script>
<style type="text/css">
	* {
		font-family: Helvetica, Verdana, Arial;
		font-size:0.95em;
	}
	.eventNotifier{
		width: 100px;
		float: left;
		color:navy;
		border: dotted 1px navy;
		padding: 4px;
		background-color:white;
		margin:3px;
	}
	.dirty{
		border: solid 1px #0ca2ff;
		color:white;
		background-color:#0ca2ff;
	}
</style>
<script type="text/javascript">
	// 加入 Shift + a-z 的熱鍵,當觸發時加入效果
	$(function(){
		$(document).bind('keydown', 'Shift+a', function (evt){jQuery('#_Shift_a').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+b', function (evt){jQuery('#_Shift_b').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+c', function (evt){jQuery('#_Shift_c').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+d', function (evt){jQuery('#_Shift_d').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+e', function (evt){jQuery('#_Shift_e').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+f', function (evt){jQuery('#_Shift_f').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+g', function (evt){jQuery('#_Shift_g').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+h', function (evt){jQuery('#_Shift_h').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+i', function (evt){jQuery('#_Shift_i').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+j', function (evt){jQuery('#_Shift_j').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+k', function (evt){jQuery('#_Shift_k').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+l', function (evt){jQuery('#_Shift_l').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+m', function (evt){jQuery('#_Shift_m').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+n', function (evt){jQuery('#_Shift_n').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+o', function (evt){jQuery('#_Shift_o').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+p', function (evt){jQuery('#_Shift_p').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+q', function (evt){jQuery('#_Shift_q').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+r', function (evt){jQuery('#_Shift_r').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+s', function (evt){jQuery('#_Shift_s').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+t', function (evt){jQuery('#_Shift_t').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+u', function (evt){jQuery('#_Shift_u').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+v', function (evt){jQuery('#_Shift_v').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+w', function (evt){jQuery('#_Shift_w').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+x', function (evt){jQuery('#_Shift_x').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+y', function (evt){jQuery('#_Shift_y').addClass('dirty'); });
		$(document).bind('keydown', 'Shift+z', function (evt){jQuery('#_Shift_z').addClass('dirty'); });
	});
</script>
 
<body>
	<strong>Shift</strong>
	<div id="_Shift_a" class="eventNotifier">Shift+a</div>
	<div id="_Shift_b" class="eventNotifier">Shift+b</div>
	<div id="_Shift_c" class="eventNotifier">Shift+c</div>
	<div id="_Shift_d" class="eventNotifier">Shift+d</div>
	<div id="_Shift_e" class="eventNotifier">Shift+e</div>
	<div id="_Shift_f" class="eventNotifier">Shift+f</div>
	<div id="_Shift_g" class="eventNotifier">Shift+g</div>
	<div id="_Shift_h" class="eventNotifier">Shift+h</div>
	<div id="_Shift_i" class="eventNotifier">Shift+i</div>
	<div id="_Shift_j" class="eventNotifier">Shift+j</div>
	<div id="_Shift_k" class="eventNotifier">Shift+k</div>
	<div id="_Shift_l" class="eventNotifier">Shift+l</div>
	<div id="_Shift_m" class="eventNotifier">Shift+m</div>
	<div id="_Shift_n" class="eventNotifier">Shift+n</div>
	<div id="_Shift_o" class="eventNotifier">Shift+o</div>
	<div id="_Shift_p" class="eventNotifier">Shift+p</div>
	<div id="_Shift_q" class="eventNotifier">Shift+q</div>
	<div id="_Shift_r" class="eventNotifier">Shift+r</div>
	<div id="_Shift_s" class="eventNotifier">Shift+s</div>
	<div id="_Shift_t" class="eventNotifier">Shift+t</div>
	<div id="_Shift_u" class="eventNotifier">Shift+u</div>
	<div id="_Shift_v" class="eventNotifier">Shift+v</div>
	<div id="_Shift_w" class="eventNotifier">Shift+w</div>
	<div id="_Shift_x" class="eventNotifier">Shift+x</div>
	<div id="_Shift_y" class="eventNotifier">Shift+y</div>
	<div id="_Shift_z" class="eventNotifier">Shift+z</div>
</body>

範例 1 範例 2

檔案描述
基本的範例檔案(免空) 開始下載
基本的範例檔案 會員限定

發表迴響