在JavaScript中截断文本，不包含html元素

Question

我正在使用以下函数来截断在其旁边有一个"read more"按钮的文本。

truncateText: function (string, targetCharacterLength) { 
    var length = string.length; 
    if (length < targetCharacterLength) { 
     return (string) 
    } else { 
     var shortenedString = string.slice(0, targetCharacterLength); 
     shortenedString = shortenedString.slice(0,shortenedString.lastIndexOf(' ')) + '... '; 
     return shortenedString 
    } 
} 

所以我的问题是与<a>标签内的文字。如果它刚好在"read more"按钮之前开始，则该按钮的功能会中断。

这是我看到的时候我在哪里的<a>标签开始只是"..."

< a... < a="" href="#" class="more" > Read More < /a...> 

之前有没有人对我怎样才能解决这一问题的思路文本检查元素？我无法使用插件。

感谢

Answer 1

你必须找到的</a>在输入字符串锚块的最后一个索引。您可以使用.lastIndexOf() JavaScript Api来完成此操作。

试试FIDDLE，这里我给出了一个带有锚标签的文本。该代码发现标记主体</a>的结束。

这是一个粗略的例子，所以我认为有一个需要使用除/a>以外的字符串的评论。

我已经更新了功能如下

function truncateText(string, targetCharacterLength) { 
    var length = string.length; 
    if (length < targetCharacterLength) { 
     return (string) 
    } else { 
     var shortenedString = string.slice(0, targetCharacterLength); 
     var tempshortenedString = shortenedString.slice(0, shortenedString.lastIndexOf(' ')); 

     var lastMarkupBegin = -1; 
     var lastMarkupEnds = -1; 
     try { 
     lastMarkupBegin = tempshortenedString.lastIndexOf("<a"); 
     lastMarkupEnds = tempshortenedString.lastIndexOf("/a>"); 
     } catch (err) {} 
     //alert(lastMarkupEnds); 
     if (lastMarkupBegin != -1) { // has an opening anchor tag 
     if (lastMarkupEnds == -1) { // not having an closing tag 
      tempshortenedString = tempshortenedString.slice(0, lastMarkupBegin); 
      //alert(tempshortenedString); 
      return tempshortenedString + '... '; 
     } 
     } 
     return shortenedString + '... ' 
    } 

希望它为你工作