《Javascript高級程序設(shè)計》14章-----過濾輸入

qc1iu 發(fā)布于2019-08-21 10:33 / 3204人閱讀

摘要：為了不要屏蔽那些非字符鍵，所以有的條件為了不屏蔽用戶輸入或者等組合鍵，判斷用戶沒有按下鍵，所以有的條件。操作剪切板都支持剪切板，但不支持。獲取和設(shè)置剪切板數(shù)據(jù)注意在下測試成功，但是在下利用不成功有時間用實踐一下方法只能在事件中才有效

1、屏蔽字符（監(jiān)聽keypress事件）

var username = document.forms["form"].username;
username.onkeypress = function(e){
    var charcode = e.charCode;
    if(!/d/.test(String.fromCharCode(charcode)) && charcode>9 && !e.ctrlKey){
        e.preventDefault();
    }
}

注意：
1、因為Firefox和Safari(3.1版本之前)會對上下鍵、左右鍵、delete鍵和退格鍵觸發(fā)keypress事件，在Firefox中非字符的charCode的值為0，在Safari（3.1版本之前）charCode的值為8。為了不要屏蔽那些非字符鍵，所以有charCode>9的條件；
2、為了不屏蔽用戶輸入ctrl+C或者Ctrl+V等組合鍵，判斷用戶沒有按下Ctrl鍵，所以有!e.ctrlKey的條件。

2、操作剪切板

IE、Firefox、Safari都支持剪切板，但Opera不支持。
支持6種事件（copy、paste、cut、beforeCopy、beforePaste、beforeCut）事件。在IE中剪切板數(shù)據(jù)利用window.clipboardData訪問，在Firefox和Safari中用event.clipboardData訪問。

獲取和設(shè)置剪切板數(shù)據(jù)

var EventUtil = {
    getClipboardData: function(e){
        var clipboardData = window.clipboardData || e.clipboardData;
        return clipboardData.getData("text");
    },
    setClipboardData: function(e, value){
        console.log(e.clipboardData);
        if(e.clipboardData){
            return e.clipboardData.setData("text/plain", value);
        }else if(window.clipboardData){
            return window.clipboardData.setData("text", value);
        }
    }
}

注意
1、在IE下測試成功，但是在chrome下利用setData不成功！有時間用http://wangningmei.is-programmer.com/posts/36438.html實踐一下；
2、getData方法只能在paste事件中才有效

云服務(wù)器 GPU云服務(wù)器高級javascript程序設(shè)計 javascript高級程序設(shè)計 javascript高級程序 javascript高級程序設(shè)計pdf

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/85763.html

相關(guān)文章

全本 | iKcamp翻譯 | 《JavaScript 輕量級函數(shù)式編程》|《你不知道的JS》姊妹篇

摘要：本書主要探索函數(shù)式編程的核心思想。我們在中應(yīng)用的僅僅是一套基本的函數(shù)式編程概念的子集。我稱之為輕量級函數(shù)式編程。通常來說，關(guān)于函數(shù)式編程的書籍都熱衷于拓展閱讀者的知識面，并企圖覆蓋更多的知識點(diǎn)。，本書統(tǒng)稱為函數(shù)式編程者。原文地址：Functional-Light-JS 原文作者：Kyle Simpson　－　《You-Dont-Know-JS》作者譯者團(tuán)隊（排名不分先后）...

paney129 2019-08-22 11:16 評論0 收藏0
如何正確學(xué)習(xí)JavaScript

摘要：然而，雖然先生對無所不知，被譽(yù)為世界的愛因斯坦，但他的語言精粹并不適合初學(xué)者學(xué)習(xí)。即便如此，在后面我還是會建議把當(dāng)做補(bǔ)充的學(xué)習(xí)資源。但目前為止，依然是學(xué)習(xí)編程的好幫手。周正則表達(dá)式，對象，事件，閱讀權(quán)威指南第，，，章。既然你找到這篇文章來，說明你是真心想學(xué)好JavaScript的。你沒有想錯，當(dāng)今如果要開發(fā)現(xiàn)代網(wǎng)站或web應(yīng)用（包括互聯(lián)網(wǎng)創(chuàng)業(yè)），都要學(xué)會JavaScript。而面對泛...

canger 2019-08-21 10:23 評論0 收藏0
[譯] 如何恰當(dāng)?shù)貙W(xué)習(xí) JavaScript

摘要：原文鏈接恰當(dāng)?shù)貙W(xué)習(xí)適合第一次編程和非的程序員持續(xù)時間到周前提無需編程經(jīng)驗繼續(xù)下面的課程。如果你沒有足夠的時間在周內(nèi)完成全部的章節(jié)，學(xué)習(xí)時間盡力不要超過周。你還不是一個絕地武士，必須持續(xù)使用你最新學(xué)到的知識和技能，盡可能地經(jīng)常持續(xù)學(xué)習(xí)和提高。原文鏈接：How to Learn JavaScript Properly 恰當(dāng)?shù)貙W(xué)習(xí) JavaScript （適合第一次編程和非 JavaSc...

Jason 2019-08-21 12:06 評論0 收藏0
翻譯連載 |《你不知道的JS》姊妹篇 |《JavaScript 輕量級函數(shù)式編程》- 引言＆前言

摘要：我稱之為輕量級函數(shù)式編程。序眾所周知，我是一個函數(shù)式編程迷。函數(shù)式編程有很多種定義。本書是你開啟函數(shù)式編程旅途的絕佳起點(diǎn)。事實上，已經(jīng)有很多從頭到尾正確的方式介紹函數(shù)式編程的書了。原文地址：Functional-Light-JS 原文作者：Kyle Simpson　－　《You-Dont-Know-JS》作者譯者團(tuán)隊（排名不分先后）：阿希、blueken、brucecham、...

2bdenny 2019-08-20 19:00 評論0 收藏0
JavaScript書籍測評

摘要：前言今天和大家一起聊聊的推薦書籍，每一本都是精選，做前端開發(fā)的朋友們?nèi)绻麤]讀過，可以嘗試一下。如果怕麻煩，也可以關(guān)注曉舟報告，發(fā)送獲取書籍，四個字，就可以得到電子書的提取碼。前言今天和大家一起聊聊JavaScript的推薦書籍，每一本都是精選，做前端開發(fā)的朋友們?nèi)绻麤]讀過，可以嘗試一下。下面給大家簡單介紹了書的內(nèi)容，還有讀書的方法，希望可以幫大家提升讀書效率。一、《JavaScr...

X1nFLY 2019-08-21 17:44 評論0 收藏0