需要用javascript展开多行，文本溢出

Question

http://jsfiddle.net/10h8t3ah/

function changeHeight(rowNum) {
  document.getElementById("demo").style.height= "70px";
  var fooBar = document.getElementById(rowNum);
  fooBar.style.height = "100px";
}

我在这里试图完成的是通过一个定义为row1、row2、row3和row4的变量( rowNum )，它将用相应的row#来改变链接和段落的高度。

我试图传递该段和链接的ID，以便如果您悬停在链接上，反之亦然，高度将发生变化。

本质上，如果您悬停在链接或段落，相应的容器并排在一起将展开在高度和文本在段落中将是可见的。我设置的段落文本带有断词的wrap属性，但无论如何它似乎只是溢出。

Answer 1

好的-有几个概念需要修正才能理解为什么这不起作用：

1. DOM对象的id 必须是唯一的(您的jsfiddle在两个“行”上使用相同的ID --我已经更新了您的代码，使其使用class而不是id )
2. 传递给您的changeHeight函数的参数必须是字符串(如果您传递row1__，那么row1必须是一个定义的变量，而应该传递'row1__‘--再次请参阅我更新的小提琴代码)

这是一个你想做的事情，我想：http://jsfiddle.net/zwyr4hn1/10/

还有一些我已经解决的小问题: 1.当一个新行悬停时，需要将其他行返回到更小的大小(我在所有行对象上都使用了类row )。2.这个css是用来让a对象按照您想要的方式调整大小的：a { display: inline-block; }。

我没有提到你提到的包装文本问题，因为我没有在小提琴上看到这个。

Answer 2

与其自行设计复杂的JavaScript函数，不如使用手风琴扩展内容。这里是引导框架手风琴，特别是为这些目的而设计的。

链接到页面，您可以在那里了解更多关于它的信息。

collapse.asp