ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

通过JavaScript将textarea换行符转换为标记符

2019-06-21 08:19:49  阅读:222  来源: 互联网

标签:javascript newline string-formatting textarea html


我正在使用html格式的textarea,我正在尝试使用< p>将其内容重新格式化为有效的html格式.和< br />标签.

我写了这个脚本,它似乎工作,但我想确保我没有遗漏任何东西.所以我要求反馈.我知道我没有考虑用户可能明确输入html标签的可能性,但这没问题,因为我将以PHP的形式发布结果.

提前致谢.

输出的一个例子:

<p>Line 1<br/>Line 2</p><p>Line 4<br/><br/><br/>Line 7</p>

和代码:

function getHTML() {

    var v = document.forms[0]['txtArea'].value;
    v = v.replace(/\r?\n/gm, '<br/>');
    v = v.replace(/(?!<br\/>)(.{5})<br\/><br\/>(?!<br\/>)/gi, '$1</p><p>');
    if (v.indexOf("<p>") > v.indexOf("</p>")) v = "<p>" + v;
    if (v.lastIndexOf("</p>") < v.lastIndexOf("<p>")) v += "</p>";
    if (v.length > 1 && v.indexOf("<p>") == -1) v = "<p>" + v + "</p>";
    alert(v);

}

请注意,这是一个代码,旨在成为CMS的一部分,我所关心的JavaScript是用这两个标签重建textarea结果.所见即所得的问题……

解决方法:

这就是我想出来的.

function encode4HTML(str) {
    return str
        .replace(/\r\n?/g,'\n')
        // normalize newlines - I'm not sure how these
        // are parsed in PC's. In Mac's they're \n's
        .replace(/(^((?!\n)\s)+|((?!\n)\s)+$)/gm,'')
        // trim each line
        .replace(/(?!\n)\s+/g,' ')
        // reduce multiple spaces to 2 (like in "a    b")
        .replace(/^\n+|\n+$/g,'')
        // trim the whole string
        .replace(/[<>&"']/g,function(a) {
        // replace these signs with encoded versions
            switch (a) {
                case '<'    : return '&lt;';
                case '>'    : return '&gt;';
                case '&'    : return '&amp;';
                case '"'    : return '&quot;';
                case '\''   : return '&apos;';
            }
        })
        .replace(/\n{2,}/g,'</p><p>')
        // replace 2 or more consecutive empty lines with these
        .replace(/\n/g,'<br />')
        // replace single newline symbols with the <br /> entity
        .replace(/^(.+?)$/,'<p>$1</p>');
        // wrap all the string into <p> tags
        // if there's at least 1 non-empty character
}

您需要做的就是使用textarea的值调用此函数.

var ta = document.getElementsByTagName('textarea')[0];
console.log(encode4HTML(ta.value));

标签:javascript,newline,string-formatting,textarea,html
来源: https://codeday.me/bug/20190621/1253281.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有