0

我在使用 DIV 标记和表单输入字段时遇到了一些问题。我使用javascript获取输入字段的值。Javascript工作正常。它获取输入字段值并显示在 DIV 标记中。问题是，当我给出一个长输入或长句子时，它会按原样显示在 div 标签中。我希望它不是以长单行的形式显示，而是以段落的形式显示。这是我的代码。

<script>
function myFunc(){
    var str = document.myform.aaa.value;
    document.getElementById('mydiv').innerHTML=str;
}
</script>



<form>
<input type="text" name="aaa" />
<input type="button" value="Post" onclick="myFunc();" >
</form>

<div id="mydiv" width="500px" height="300px">Old text</div>

如果我给它一个输入，例如：

hello there, how are you hello there, how are youhello there, how are youhello there.

它以单行而不是段落格式显示。我希望它以这种形式显示上面的句子：

hello there, how are you hello there, 
how are youhello there, how are youhello 
there.

我自己有一些整理。我的意思是说，如果我写一个带有空格的句子，它可以正常工作，但如果有一长串没有任何空格的字母，那么它就不起作用。我想要的是，要么我可以输入空格和没有空格，它应该可以双向工作。

4

2 回答 2

0

尝试使用 css 来设置widthandheight的<div>而不是属性。

jsFiddle

<div id="mydiv" style="width: 200px; height: 200px;">Old text</div>

更好的是创造一种风格：

.comments {
    width: 200px;
    height: 200px;
}

<div id="mydiv" class="comments">Old text</div>

使用自动换行来解决没有空格的问题。

word-wrap:break-word
于 2013-01-23T20:27:02.927 回答
0

这与javascript没有任何关系。默认情况下，DIV 标签将扩展到其父元素的 100%。

如果将 div 的宽度设置为特定的百分比或像素宽度，则该 div 的内容将相应地换行。

您可以使用 CSS 来定义宽度，但您必须知道要设置它的宽度。

#mydiv {
    width:50%; //I just guessed at this number
}

或者

#mydiv {
    width:100px; 
}

或者，您可以使用 javascript 来设置它。（尽管最好使用 CSS 进行设置）

document.getElementById('mydiv').style = "width:50%';
于 2013-01-23T20:27:52.600 回答