站內搜尋

Saturday, October 30, 2010

[jQuery] 套件-在表單欄位輸入時,呼叫虛擬鍵盤...

有時候某些網頁會考量安全性的因素,希望使用者在輸入特別欄位時(例如:密碼),不要用鍵盤輸入,這時候就需要做一個虛擬鍵盤,給使用者用滑鼠去點擊他想輸入的文字,jquery的jQuery Keypad套件,可以很簡單做到這件事...
1、到 jQuery Keypad官網下載套件壓縮檔

2、我們只要裡面的 jquery.keypad.js 跟 jquery.keypad.css 兩個檔案


3、去jquery官網下載jquery.js檔案

4、網頁程式碼如下
head部分:

<style type="text/css">
@import "jquery.keypad.css";
</style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.keypad.js"></script>
<script type="text/javascript">
$(function () {
$('#defaultKeypad').keypad({ keypadOnly: false, layout: [ '1234567890' + $.keypad.CLOSE,
'abcdefghij' + $.keypad.CLEAR,
'klmnopqrst' + $.keypad.BACK,
'uvwxyz@_-.' + $.keypad.SHIFT
]});
});
</script>
body部分:
<input type="text" id="defaultKeypad">

No comments:

Post a Comment