Question

我在javascript中动态创建列表。我想以点点（.....）打破长话。例如，如果单词是“软件生命周期开发”，我想将其更改为“Software life cycl ....”。

我用“WORD-BREAK：BREAK-ALL; white-space：normal;” 我目前的输出是：

软件生命周期发展。

谁能说出来，如何解决这个问题？提前谢谢。

  var parent = document.getElementById('searchlistview');
var listItem = document.createElement('li');
listItem.setAttribute('id', 'listitem_' + listId);
listItem.setAttribute('data-icon', 'false');
listItem.innerHTML = "<img src=" + imagesrc + " class='ui-li-icon ui-li-has-icon'></img>
<a target='_black' data-role='button' href='#' id=" + listId + " name= " + url + " data-theme ='c' rel='external' 
data-inline='true' style='margin-left:0em; WORD-BREAK:BREAK-ALL;white-space:normal; ' >" + searchName + "<p style='margin-top:1px;margin-left:1px;'>
File size: " + fileSize + "</p></a>";
parent.appendChild(listItem);

Answer 1

你可以尝试这个css

text-overflow:ellipsis;

文本溢出时会放...。请参阅此page以供参考。

Answer 2

看看css省略号是否可以帮到你。您可以在

找到更多详细信息

http://www.w3schools.com/cssref/css3_pr_text-overflow.asp

http://mattsnider.com/css/css-string-truncation-with-ellipsis/

Answer 3

尝试：

function wbr(str, num) { 
  return str.replace(RegExp("(\\w{" + num + "})(\\w)", "g"), function(all,text,char){
    return text + "<wbr>" + char;
  });
}

来源：http://ejohn.org/blog/injecting-word-breaks-with-javascript/

Answer 4

style="text-overflow: ellipsis;"

将解决问题。

如何打破html中的长字？

4 个答案: