断线测试

Question

如何使用JS测试字符/ HTML实体是否符合换行符或不中断？

换行符的例子：

• 好的' ServerB＆lt;这是一个空间

非破坏字符的示例是：

• -＆lt;不间断的空间
•  ＆lt;不间断的连字符
• ‑＆lt;字木匠

我知道还有更多的HTML实体是行/非中断字符，我不知道它们是什么。如何在不事先知道的情况下检查是否有换行符？

Answer 1

您可以通过创建具有最小宽度的测试div来测试它，然后检查文本是否包装到下一行。

＆＃13;

＆＃13;

var tester=document.getElementById("test");
var html=document.getElementById("html").value;

function testfor() {
  var tester=document.getElementById("test");
  var html=document.getElementById("html").value;
  var itIs=false;
  tester.innerHTML="a";
  var height_init=tester.clientHeight;
  console.log(height_init);
  tester.innerHTML+=html+"a";
  var height_final=tester.clientHeight;
  console.log(height_final);
  if(height_final > height_init) {
  	itIs=true
  }
  document.getElementById("return").innerHTML=itIs;
}
document.getElementById("html").addEventListener("keydown", function(e) {
    if (!e) { var e = window.event; }

    // Enter is pressed
    if (e.keyCode == 13) { testfor(); }
}, false);

＆＃13;

#test{
  width: 1px;
  line-height: 30px;
  font-size: 18px;
}

＆＃13;

<div id="test">this&nbsp;text&nbsp;box&nbsp;will&nbsp;take&nbsp;any&nbsp;length&nbsp;of&nbsp;string, and&nbsp;test&nbsp;if&nbsp;the&nbsp;lines&nbsp;break, however&nbsp;it&nbsp;was&nbsp;not&nbsp;designed&nbsp;to&nbsp;handle more&nbsp;than&nbsp;one&nbsp;character/entity/tag&nbsp;at&nbsp;a&nbsp;time</div>
<input id="html" type="text" placeholder="type an HTML character/entity/tag"/>
<p id="return">

</p>

＆＃13;

＆＃13;

＆＃13;