栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > 后端开发 > Python

【去除样式】jquery粘贴内容时去除样式,仅粘贴文本

Python 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

【去除样式】jquery粘贴内容时去除样式,仅粘贴文本

  • 本文收录于《HTML5与jQuery教程》专栏,此专栏聚焦于HTML5网页开发中的技巧与常用方法,将持续更新,欢迎大家订阅!
  • ​​个人主页:有梦想的程序星空
  • ​​个人介绍:小编是人工智能领域硕士,全栈工程师,深耕Flask后端开发、数据挖掘、NLP、Android开发、自动化等领域,有较丰富的软件系统、人工智能算法服务的研究和开发经验。
  • ​​如果文章对你有帮助,欢迎​​关注、​​点赞、​​收藏、​​订阅。

问题:有时候,针对contenteditable="true"的元素或是

元素,在粘贴内容时会将文本的标签样式如一起粘贴过来,造成网页上内容提取时出现问题。

解决方法:

针对contenteditable="true"的

元素,其中包含id为tbody_test的元素。

使用DOM操作动态添加了多个的子元素

使用如下jquery的paste事件方法去除样式:

$("#tbody_test").on('paste',"#tbody_test .td_test_class", function(e){        
        e.stopPropagation();
        e.preventDefault();
        var text = '', event = (e.originalEvent || e);
        if (event.clipboardData && event.clipboardData.getData) {
            text = event.clipboardData.getData('text/plain');
        } else if (window.clipboardData && window.clipboardData.getData) {
            text = window.clipboardData.getData('Text');
        }
        //去除文本头尾的空白符
        text = text.trim();

        if (document.queryCommandSupported('insertText')) {
            document.execCommand('insertText', false, text);
        } else {
            document.execCommand('paste', false, text);
        }
})

以上方法去除了剪贴板内容中的样式,使得剪贴板保留纯文本内容。

扩展:

(1)如果td元素中本身存在空格、换行符等内容,可以采用如下方式去除:

function noSpaceBr(text){
    text = text.replace(/ /ig, "");
    text = text.replace(/
/ig, ""); text = text.trim(); return text }

(2)也可以采用以下方式去除部分html标签的样式:

function noHtmlTag(str){
  return str.replace(/<[^>]+>/g,"");
}

关注微信公众号【程序遇上智能星空】,了解软件系统和人工智能算法领域的前沿知识,让我们一起学习、一起进步吧!

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/1012715.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号