Javascript 在chrome中使用标点符号时遇到js word break的问题

Javascript 在chrome中使用标点符号时遇到js word break的问题,javascript,css,Javascript,Css,我在JSFIDLE中有以下示例: 分词应该只导致额外的字符换行。但是只需在结尾添加句点,直到你看到坏的字符结束。所有的句号和最后一封信的结尾,这似乎是一个错误。 它只是一个contenteditable,其单词break属性设置为“break all”。正如预期的那样,如果我键入一个长单词,它将在字符上中断,并在下一行继续。但是,如果我添加了一系列标点符号以导致中断,(,“!等),而不仅仅是出现在下一行的标点符号,它还会拖动最后一个非标点符号的字母,这完全出乎意料。这似乎是一个错误,但有没

我在JSFIDLE中有以下示例:


分词应该只导致额外的字符换行。但是只需在结尾添加句点,直到你看到坏的字符结束。所有的句号和最后一封信的结尾,这似乎是一个错误。
它只是一个contenteditable,其单词break属性设置为“break all”。正如预期的那样,如果我键入一个长单词,它将在字符上中断,并在下一行继续。但是,如果我添加了一系列标点符号以导致中断,(,“!等),而不仅仅是出现在下一行的标点符号,它还会拖动最后一个非标点符号的字母,这完全出乎意料。这似乎是一个错误,但有没有解决方案可以强制在行尾的最后一个字符处发生中断?

根据计划,它可以正常工作。规范说明了“全部中断”:

除“正常”软包装机会外,任何两个字母之间的换行可能中断(除非“换行”属性禁止)。不应用断字

此外:

在本规范中,字母是属于Unicode中字母或数字一般类别之一的字符

因此,由于句号、感叹号、逗号和其他标点符号不被视为字母,所以即使有一系列非字母,它也会将最后一个字母拉到下一行。您看到的行为不是bug,而是规范的正确实现。

根据说明,它正在按预期工作。规范说明了“全部中断”:

除“正常”软包装机会外,任何两个字母之间的换行可能中断(除非“换行”属性禁止)。不应用断字

此外:

在本规范中,字母是属于Unicode中字母或数字一般类别之一的字符


因此,由于句号、感叹号、逗号和其他标点符号不被视为字母,所以即使有一系列非字母,它也会将最后一个字母拉到下一行。您看到的行为不是bug,而是规范的正确实现。

解决方案是将
­使用javascript在所有字符之间切换。在插入、删除、更改或复制文本时,必须对其进行更新

问题:按backspace键时,每秒只删除一个字符。你也必须解决这个问题


总而言之,我想这真的很难看,但它可以工作。(如果值得的话)

一个解决办法是把
放在shy使用javascript在所有字符之间切换。在插入、删除、更改或复制文本时,必须对其进行更新

问题:按backspace键时,每秒只删除一个字符。你也必须解决这个问题


总而言之,我想这真的很难看,但它可以工作。(如果值得的话)

似乎是谷歌Chrome的一个bug。不在Firefox中。似乎是Google Chrome中的一个bug。不是在Firefox中。@KarlRim是的。这正是说明书上说的。由于句点、逗号和其他标点符号不是字母,规范中说两个字母之间的行可能会断开。断开发生在所有额外标点符号之前的最后两个字母之间。在您的评论示例中,在最后两个g's.Argh之间,这太糟糕了。我不认为有任何方法可以强迫它不这样做,只针对任何字符而不是字母?@karlim-Yup。这正是说明书上说的。由于句点、逗号和其他标点符号不是字母,规范中说两个字母之间的行可能会断开。断开发生在所有额外标点符号之前的最后两个字母之间。在您的评论示例中,在最后两个g's.Argh之间,这太糟糕了。我不认为有任何方法可以强迫它不这样做,只在任何字符上,而不仅仅是字母上?你是对的,Firefox工作正常。我尝试添加­;字符,但是连字符在换行符上变为可见,这打破了我的用例。我只是想让它以不可见的方式包装。实际上,如果我切换到\u2063,不可见分隔符,它似乎可以做我想做的事情,但当然我现在必须处理这个额外的不可见字符的情况。但是谢谢你的建议。实际上,最后嵌入了分词标签。看起来效果更好,而且我不必更改文本节点You's correct Firefox工作正常。我尝试添加­;字符,但是连字符在换行符上变为可见,这打破了我的用例。我只是想让它以不可见的方式包装。实际上,如果我切换到\u2063,不可见分隔符,它似乎可以做我想做的事情,但当然我现在必须处理这个额外的不可见字符的情况。但是谢谢你的建议。实际上,最后嵌入了分词标签。似乎工作得更好,我不必改变文本节点
<div contenteditable='true' style='word-break: break-all;'>
Word-break should cause just the extra character to wrap.  But just keep adding periods at the end until you wrap to see the bad char wrap.  All the periods AND the last letter wrap, this seems like a bug.
</div>