【问题标题】:Javascript inserting weird newLine characterJavascript插入奇怪的换行符
【发布时间】:2017-02-08 15:41:19
【问题描述】:

我有一个名为 verses 的数组,其中包含从 ajax 响应创建的字符串。数组是这样创建的:

verses.push(splitStr[i].replace('\n',''));

稍后我创建一些<span> 元素并附加数组中的值。然而,数组中的最后一个元素总是有一个奇怪的行为,因为它包含一个隐藏的 ASCII 字符 new line ,它的代码是 10 (在控制台中检查过)。现在,当我在控制台中打印时,记录数组中的最后一个元素 a 得到这个结果:"string"。然后我创建包含此字符串的 span 元素,稍后当我从 span 中检索值时,我得到:

"string
"

那是因为在创建跨度时它总是插入这个奇怪的new line 字符。所以在源代码中,span 看起来像:

<span class="answer" onclick="checkAnswer(this)">potopului
</span>

你可以看到结束标签在下一行。

在控制台中,我使用了一些断点,并从跨度中提取了这个值:"string↵"

现在,有谁知道为什么在创建这个 span 时,javascript 会插入一个 new line 字符,为什么它只发生在数组的最后一个元素上?

用于创建 span 元素的代码:

for (var i = 0; i < 3; i++) {
        if (i!=phtml) {
            tags.push("<span class='answer' onclick='checkAnswer(this)'>"+generateRandom(pos)+'</span>'); 
            //generate a  string from the array different from the one with position pos
        }else{
            tags.push("<span class='answer'  onclick='checkAnswer(this)'>"+verses[pos].replace('\n','')+'</span>');
        }
    }
    var output='';
    for (var i = 0; i < tags.length; i++) {
        output = output + tags[i];
    }
    document.getElementsByClassName('v-options')[0].innerHTML = output;

checkAnswer() 函数:

function checkAnswer(e){
    var text = e.innerHTML;
    var input = document.getElementsByClassName('hidden-word')[pos];
    if (text == verses[pos]) {
        input.value = verses[pos];
        input.setAttribute('disabled','');
    }
    console.log(":"+text.substring(0, text.length-1) + ":"+verses[pos]+":");
}

【问题讨论】:

  • 如果你想清除 all 换行符,那就是.replace(/\n/g, '')——你的代码只是替换了 first 换行符。
  • 尝试.replace(/\n\r|\n|\r/g, '')
  • 谢谢,@MysterX!成功了!
  • @MysterX,您可以发表您的评论作为答案,以便我可以将问题标记为已回答。
  • @AlinCrescensCiurea,已创建答案

标签: javascript jquery html arrays ascii


【解决方案1】:

有时换行符以不同的样式打印。通常它是两个特殊字符 \n\r 的组合,因此您只需要检查所有可能类型的换行符组合或其丢失的损坏部分。尝试更改您的 RegExp 以匹配它们:

splitStr[i].replace(/\n\r|\n|\r/g, '')

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2012-08-31
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多