如何使 Internet Explorer 在将 innerHTML 传输到 <textarea> 时包含所需的换行符

How do I make Internet Explorer include the required line feeds when transferring innerHTML to a <textarea>?

本文关键字:textarea 包含所 换行符 何使 在将 Explorer innerHTML 传输 Internet      更新时间:2023-09-26

这个JavaScript程序的目的是使用户能够在社交网络上报告问题,并在初始消息中包含所有相关信息。

用户通过在由文本框组成的表单上回答一组问题来输入信息,等等。 答案用于创建字符串文本数组,其元素连接起来形成单个字符串。然后,此字符串显示在页面末尾,供用户复制,然后粘贴到社交网络页面上。

到目前为止,这是通过将字符串(使用document.getElementById('divName').innerHTML)放置在为此目的而设置的<div>中来完成的。没关系:适用于所有五种浏览器,甚至可以在iPhone上运行。

现在,为了使用户更容易在发布报表之前对报表进行细微更改(并使其更易于复制),我希望能够将报表放置在输入表单的<textarea>部分中,而不是放在<div>中。这也很好:适用于Firefox,Chrome,Opera和Safari - 甚至在Iphone上 - 但是...

由于某种不可避免的情况,整个阅兵场上唯一步调一致的浏览器 - MSIE - 无法处理它。它将信息放在<textarea>中 - 减去所有换行符。数组已初始化:

function createReport() { // [0] and [21] are constant.
    outReportArray[0] = 'E M E R G E N C Y' + horizLine;
    for (i=1 ; i&lt;outReportArray.length ; i++) {
        outReportArray[i] = '';
    }
    outReportArray[21] = 'Thank you.';
}

(全局变量horizLine是一系列m规则(&#8212;),两端各有一个换行符。

当用户浏览表单时,数组将更新:

outReportArray[element] = label + value + (underLine ? horizLine : '&#13;&#10;');

(还尝试了以下方法来生成换行符:''n', ''r'n', ''r', '&#13;', '&#10;'

输出字符串不断重建并粘贴到<textarea>,以便当他到达表单底部时,他按下"更新"按钮并简单地传输到<<textarea>:>

outReportStr = '';  // Initialize the output string.
// Build the output string from the output array.
for (i=0 ; i<outReportArray.length ; i++) {
    outReportStr += outReportArray[i];
}
// Populate the <textarea> 'outbox'.
document.getElementById('outbox').innerHTML = outReportStr;

通常<textarea>的内容如下所示:

E M E R G E N C Y
———————————
Name: John Doe
Land-line: (213) 555 1234
Cell-phone: (213) 555 1235
E-mail: JDoe@aol.com
———————————
Location of animal now:
Washington (St Landry Parish), La
———————————
&c.

(还有更多内容,但这演示了输出中所需的布局。

但是,在 Internet Explorer 中,每个换行符都替换为一个空格:

E M E R G E N C Y ——————————— Name: John Doe Land-line: (213) 555 1234 Cell-phone: (213) 555 1235 E-mail: JDoe@aol.com ——————————— Location of animal now: Washington (St Landry Parish), La ——————————— &c.

我的问题是:如何使Internet Explorer在传输到"发件箱"<textarea>内部HTML中包含所需的换行符?

(我尝试创建一个由内部HTML组成的textNode,然后将其作为子项附加到<textarea>; 没有骰子:然后我得到的是所有字符实体代码(&#...),而不是字符本身。

我是这个游戏的业余爱好者,所以,除了不想将比HTML,CSS和JavaScript更复杂的东西强加给用户之外,我不想参与复杂的插件和专有库。珍珠门的前排座位,任何人都可以帮助我解决这个问题!

揭幕战重新出价

首先,请允许我对所有回答我问题的人表示衷心感谢。 我甚至怀疑得到回应,更别提这么快了。

您富有洞察力的回答不仅解决了我的问题,而且教会了我很多关于我正在部署的语言,远远高于我的工资等级——即使是我从未使用过的语言!

@Kolink和@JayC告诉我使用.value而不是.innerHTML(Kolink采取告诫的语气非常正确)。 虽然我知道.value是将数据从输入元素传输到程序的过程的一部分,但我什至没有想到它可能被写入:d'oh!我相信是这个词。

也感谢您@RobG感谢您使用'u代码的说明; 当涉及到使用.value.innerHTML时,这是解决方案的重要组成部分。

@deceze建议,实际上是恳求,我学习"降价"(我一直认为这是零售商应用于他们投放清仓销售的商品的东西)。 他没有说这是为了我的利益还是为了他作为可能的受访者,但是,在谷歌上搜索它,我发现了一个非常有趣的替代我使用的jEdit,它的优势在于"代码"(文本的Markdown版本)可以被人类阅读,这必须使编辑更容易。 谢谢你,欺骗,我会在适当的时候研究一下(我什至尝试过在其中编码此消息); 就目前而言,据我所知,手头有 Perl,我将不得不坚持我(几乎)知道的东西。

当然,你们都有资格坐在珍珠门的前排座位上。 感谢大家使我第一次访问这样一个论坛既富有成效又愉快。

ΠΞ

设置文本区域的value,而不是其innerHTML。在HTML中,空格被剥离 - 你应该知道只是通过制作一个基本的网页。Internet Explorer只是做正确的事情,不像其他浏览器...

文本区域非常像输入。 为什么不使用 value 属性?

''' 应该可以工作。在 IE 8 中插入以下内容作为文本区域元素的值会返回(为方便起见,换行):

  var s = 'E M E R G E N C Y'n' +
           ''u2014'u2014'u2014'u2014'u2014'u2014'u2014'u2014'u2014'u2014'n' +
           'Name: John Doe Land-line';

我仅将 unicode 值而不是 HTML 字符实体替换为"—"字符。您可能想使用"'''r",但我认为没有必要。

哦,你也可以做这样的事情:

  var t = ['E M E R G E N C Y',
           ''u2014'u2014'u2014'u2014'u2014'u2014'u2014'u2014'u2014'u2014',
           'Name: John Doe Land-line'];

然后将值设置为:

  t.join(''n') // or t.join(''u000d');

您还可以用'u000a代替换行,用'u000d代替回车。

相关文章: