18910140161

(js)粘贴时去掉HTML格式

顺晟科技

2022-09-15 21:01:49

289

  一、IE能够触发onbeforepaste事件,因此可以在该事件中直接改变剪贴板中的内容实现过滤效果

  二、谷歌由于不能触发onbeforepaste,先阻止默认行为,通过window.getSelection()获取光标位置,在该位置替换上处理完成的字符

具体实现代码:

 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() 获取到图片然后上传)

相关文章
我们已经准备好了,你呢?
2024我们与您携手共赢,为您的企业形象保驾护航