Javascript 需要帮助将文本保持在3行上而不考虑长度吗

我需要找到一种方法，使用jQuery将文本保持在3行上，而不管其长度如何。（我猜是javascript）

因此，本文：

First Project Name Combined with First Location

Second Project Name Combined with Second Location And Text To Make This Text Area Even More Incredibly Extra Long

已插入打断，使其看起来如下所示：

First Project Name
Combined with
First Location

Third Project Name Combined with Third
Location And Text To Make This Text Area
Even More Incredibly Extra Extra Long

而这一文本：

First Project Name Combined with First Location

Second Project Name Combined with Second Location And Text To Make This Text Area Even More Incredibly Extra Long

已插入打断，使其看起来如下所示：

First Project Name
Combined with
First Location

Third Project Name Combined with Third
Location And Text To Make This Text Area
Even More Incredibly Extra Extra Long

我假设代码将涉及到计算字符或空格的数量，除以3，然后在相对于分割长度的这么多空格后插入换行符。但我不太确定如何在代码中编写这个

我已经用我正在使用的实际代码进行了设置。代码需要很好地处理第一位代码。（一位了不起的stackoverflow用户已经优雅地解决了这个问题）

---

有什么想法吗？

注意：可能有比你建议的更好的方法；如果有，我不知道，但我将此作为实现建议方法的一种方式，而不一定是解决问题的最佳方式

假定字符串存储在

str

中

var len = str.length; // total length of the string
var breakpoint = len/3; // caching a third of it
var bp1 = -1; // location of the first <br>
var bp2 = -1; // location of the second <br>
for ( var i = 0; i < len; ++i ) // going through the entire string
{
    if ( str[i] == ' ' ) // might be a good idea to check for any whitespace character
    {
        if ( bp1 < 0 || Math.abs(breakpoint - i) < Math.abs(breakpoint - bp1) )
        { // either the first time through, or a better location for the first <br> than the previous best
            bp1 = i;
        }
        else if ( bp2 < 0 || Math.abs((bp1+breakpoint) - i) < Math.abs((bp1+breakpoint) - bp2) )
        { // either the first time after getting the first <br>, or a better location for the second <br>
            bp2 = i;
        }
    }
}
if ( bp1 > 0 && bp2 > 0 ) // found places
{
    str = str.substring(0, bp1) + '<br>' + str.substring(bp1+1, bp2) + '<br>' + str.substring(bp2+1);
}
else
{
    // didn't work; put some error checking code here?
}

var len=str.length；//字符串的总长度
变量断点=len/3；//缓存其中的三分之一
变量bp1=-1；//第一个的位置

变量bp2=-1；//第二个的位置

for（var i=0；i
bp1=i；
}
else if（bp2<0 | | Math.abs（（bp1+断点）-i）后的第一次，或第二个
的更好位置
bp2=i；
}
}
}
if（bp1>0&&bp2>0）//找到位置
{
str=str.substring（0，bp1）+'
'+str.substring（bp1+1，bp2）+'
'+str.substring（bp2+1）；
}
其他的
{
//不起作用；请在此处放置一些错误检查代码？
}

注意：可能有比您建议的更好的方法；如果有，我不知道，但我将此作为实现建议方法的一种方式，而不一定是解决问题的最佳方式

假定字符串存储在

str

中

var len = str.length; // total length of the string
var breakpoint = len/3; // caching a third of it
var bp1 = -1; // location of the first <br>
var bp2 = -1; // location of the second <br>
for ( var i = 0; i < len; ++i ) // going through the entire string
{
    if ( str[i] == ' ' ) // might be a good idea to check for any whitespace character
    {
        if ( bp1 < 0 || Math.abs(breakpoint - i) < Math.abs(breakpoint - bp1) )
        { // either the first time through, or a better location for the first <br> than the previous best
            bp1 = i;
        }
        else if ( bp2 < 0 || Math.abs((bp1+breakpoint) - i) < Math.abs((bp1+breakpoint) - bp2) )
        { // either the first time after getting the first <br>, or a better location for the second <br>
            bp2 = i;
        }
    }
}
if ( bp1 > 0 && bp2 > 0 ) // found places
{
    str = str.substring(0, bp1) + '<br>' + str.substring(bp1+1, bp2) + '<br>' + str.substring(bp2+1);
}
else
{
    // didn't work; put some error checking code here?
}

var len=str.length；//字符串的总长度
变量断点=len/3；//缓存其中的三分之一
变量bp1=-1；//第一个的位置

变量bp2=-1；//第二个的位置

for（var i=0；i
bp1=i；
}
else if（bp2<0 | | Math.abs（（bp1+断点）-i）后的第一次，或第二个
的更好位置
bp2=i；
}
}
}
if（bp1>0&&bp2>0）//找到位置
{
str=str.substring（0，bp1）+'
'+str.substring（bp1+1，bp2）+'
'+str.substring（bp2+1）；
}
其他的
{
//不起作用；请在此处放置一些错误检查代码？
}

这是小提琴：

---

问题是：

你可能想分享你对如何解决问题的想法？！为什么您需要使用javascript来完成您正在做的事情？将原始问题（）中的跨距设置为display:block将在不编写脚本的情况下具有相同的效果，但现在它们已被删除，您无法自然区分一行和另一行。更多关于您需要实现什么的详细信息可能会帮助您获得解决整个问题的答案。霍尔斯克认为使用现有标记会更好，这是正确的，但我认为最好将

切换到

，而不是给出

显示：块样式。嗯，两个跨度需要合并在一起，因为整个过程需要动态调整大小。如果第一个跨度为1个单词长，第二个跨度为15个单词长，则第二个跨度中的单词需要向上延伸到第一个跨度，以便看起来正确。我不能只在显示时设置它们：阻止并调整它们的大小，因为我需要根据文本的长度动态设置宽度，同时将所有文本保持在3行上。你可能想分享你如何解决这个问题的想法？！为什么您需要使用javascript来完成您正在做的事情？将原始问题（）中的跨距设置为display:block将在不编写脚本的情况下具有相同的效果，但现在它们已被删除，您无法自然区分一行和另一行。更多关于您需要实现什么的详细信息可能会帮助您获得解决整个问题的答案。霍尔斯克认为使用现有标记会更好，这是正确的，但我认为最好将

切换到

，而不是给出

显示：块样式。嗯，两个跨度需要合并在一起，因为整个过程需要动态调整大小。如果第一个跨度为1个单词长，第二个跨度为15个单词长，则第二个跨度中的单词需要向上延伸到第一个跨度，以便看起来正确。我不能只在显示时设置它们：阻塞并调整它们的大小，因为我需要根据文本的长度动态设置宽度，同时将其保持在3行上。