(js)粘貼時去掉HTML格式

  1、IE可以觸發onbeforepaste事件,所以能夠在該事件中直接改變剪貼板中的內容實現過濾效果spa

  2、谷歌因爲不能觸發onbeforepaste,先阻止默認行爲,經過window.getSelection()獲取光標位置,在該位置替換上處理完成的字符code

具體實現代碼:blog

 1 // 輸入框綁定事件
 2     function addPasteEvent (ele) {
 3         var isIE = isIE();
 4         // 只有IE支持beforepaste
 5         if (isIE) {
 6             ele.addEventListener('beforepaste', function () {
 7                 if(window.clipboardData){
 8                     var txt = window.clipboardData.getData("text");
 9                     if(txt != "" && txt != null){
10                         window.clipboardData.setData('text',val);
11                     }
12                 }
13             })
14         } else {
15             // 綁定粘貼事件
16            ele.addEventListener('paste', function () {
17                if (e.originalEvent.clipboardData) {
18                     // 阻止默認行爲
19                     e.preventDefault();
20                     var clipboardData = e.originalEvent.clipboardData;
21                     // 獲取剪貼板的文本
22                     var text = clipboardData.getData('text');
23                     if (window.getSelection && text !== '' && text !== null) {
24                         // 建立文本節點
25                         var textNode = document.createTextNode(text);
26                         // 在當前的光標處插入文本節點
27                         var range = window.getSelection().getRangeAt(0);
28                         // 刪除選中文本
29                         range.deleteContents();
30                         // 插入文本
31                         range.insertNode(textNode);
32                     }
33                 }
34            });
35         }
36     }
37 function isIE() {
38          if (!!window.ActiveXObject || 'ActiveXObject' in window) {
39              return true;
40          } else {
41               return false;
42          }
43     }

備註:(谷歌粘貼圖片能夠使用getAsFile() 獲取到圖片而後上傳)事件

相關文章
相關標籤/搜索