《PHP實(shí)戰(zhàn):WordPress用戶登錄框密碼的隱藏與部分顯示技巧》要點(diǎn):
本文介紹了PHP實(shí)戰(zhàn):WordPress用戶登錄框密碼的隱藏與部分顯示技巧,希望對(duì)您有用。如果有疑問,可以聯(lián)系我們。
讓W(xué)ordPress登錄頁的密碼框顯示最后一個(gè)輸入的字符
在通常情況下,網(wǎng)頁的設(shè)計(jì)者們會(huì)將密碼輸入框中的所有字符暗藏成黑點(diǎn),以防止有人在背后偷窺輸入的密碼,如:
PHP實(shí)戰(zhàn)
PHP實(shí)戰(zhàn)
這種暗碼輸入模式雖然減少了被偷窺的危險(xiǎn),但是給我們的暗碼輸入帶來了很多麻煩,因?yàn)槲覀儾恢赖降纵斎肓耸裁醋址?所以經(jīng)常導(dǎo)致輸錯(cuò)暗碼的情況,浪費(fèi)了很多時(shí)間.PHP實(shí)戰(zhàn)
可能你也已經(jīng)注意到,現(xiàn)在智能手機(jī)的很多應(yīng)用中,使用了這樣一種密碼框處理方式:對(duì)用戶在密碼框中輸入的最后一個(gè)字符,會(huì)先讓它顯示2-3秒鐘,然后再暗藏,這樣可以讓用戶知道剛剛輸入了什么字符,減少了輸錯(cuò)的可能性,同時(shí)兼具防偷窺功能.如:
PHP實(shí)戰(zhàn)
PHP實(shí)戰(zhàn)
本日,我將給大家介紹,在WordPress中如何實(shí)現(xiàn)這個(gè)的功能,步驟非常簡(jiǎn)單.PHP實(shí)戰(zhàn)
1、添加js
點(diǎn)此下載 必要用到的js,將此js文件放到當(dāng)前使用主題的根目錄下.PHP實(shí)戰(zhàn)
2、添加php代碼
用文本編輯器打開當(dāng)前主題的functions.php,添加以下php代碼:PHP實(shí)戰(zhàn)
function ludou_dPassword() { wp_enqueue_script( 'dPassword', get_template_directory_uri() . '/jQuery.dPassword.js', array(), '1.0', true ); } add_action( 'login_enqueue_scripts', 'ludou_dPassword' );
好了,這個(gè)功能就添加成功了,就這么簡(jiǎn)單.PHP實(shí)戰(zhàn)
補(bǔ)充說明
1、如果你要將js文件放在當(dāng)前主題的js目錄,那你需要將php代碼第2行中的 /jQuery.dPassword.js 改成 /js/jQuery.dPassword.js
2、此功能在輸入密碼時(shí),只能在最后輸入或刪除字符,已經(jīng)被暗藏成黑點(diǎn)的密碼中間不能添加或刪除字符.PHP實(shí)戰(zhàn)
讓W(xué)ordPress登錄框顯示/暗藏輸入的密碼
這可以讓用戶知道剛剛輸入了什么字符,減少了輸錯(cuò)密碼的可能性,同時(shí)兼具防偷窺功能.PHP實(shí)戰(zhàn)
現(xiàn)在,我們還有另外一種選擇,直接讓用戶自行根據(jù)需要選擇是全部暗藏輸入的密碼,還是全部顯示輸入的密碼.在全部顯示密碼框的內(nèi)容時(shí),用戶輸錯(cuò)的可能性就大大降低,這也是微軟推薦的一種密碼框處理方式.效果如下:
PHP實(shí)戰(zhàn)
PHP實(shí)戰(zhàn)
全部暗藏密碼,點(diǎn)擊密碼框右邊的眼睛圖標(biāo)可以顯示密碼PHP實(shí)戰(zhàn)
全部顯示密碼,點(diǎn)擊密碼框右邊的鎖頭圖標(biāo)可以暗藏密碼PHP實(shí)戰(zhàn)
1、添加jsPHP實(shí)戰(zhàn)
點(diǎn)此下載 必要用到的js,將此js文件放到當(dāng)前使用主題的根目錄下.PHP實(shí)戰(zhàn)
2、添加php代碼PHP實(shí)戰(zhàn)
function ludou_prevue() { wp_enqueue_script("jquery"); wp_enqueue_script( 'prevue', get_template_directory_uri() . '/jquery.prevue.min.js', array(), '1.0', true ); ?> <style type="text/css"> .prevue-icon-eye:before { content: "\f177"; } .prevue-icon-eye-off:before { content: "\f160"; } </style> <?php } add_action( 'login_enqueue_scripts', 'ludou_prevue' ); ?>
好了,大功造成!PHP實(shí)戰(zhàn)
補(bǔ)充說明PHP實(shí)戰(zhàn)
1、如果你要將js文件放在當(dāng)前主題的js目錄,那你必要將php代碼第3行中的 /jquery.prevue.min.js 改成 /js/jquery.prevue.min.js
2、此功能必要1.9.0以上版本的jQuery支持.PHP實(shí)戰(zhàn)
歡迎參與《PHP實(shí)戰(zhàn):WordPress用戶登錄框密碼的隱藏與部分顯示技巧》討論,分享您的想法,維易PHP學(xué)院為您提供專業(yè)教程。
轉(zhuǎn)載請(qǐng)注明本頁網(wǎng)址:
http://www.snjht.com/jiaocheng/7940.html