我有一个带有文本区域并包含几个按钮的表单，其中一个将添加一个额外的文本区域，另一个将一次删除一个文本区域，除非它是最后一个。它有效，只是我希望每个文本区域的大小与原始文本区域的大小相同，但我似乎无法弄清楚我做错了什么。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>CPO Exit Form</title>
<script type='text/javascript' src='Scripts/jquery-1.9.1.js'></script>
<link rel="stylesheet" href = "Styles/Site2.css"></link>
<script type="text/javascript">
$(document).ready(function(){
var counter = 2;
$("#addButton").click(function () {
if(counter>9){
alert("Only 9 areas can be added to the form.");
return false;
}
var newTextBoxDiv = $(document.createElement('div'))
.attr("id", 'TextBoxDiv' + counter);
newTextBoxDiv.after().html('<label>'+ counter + ' : </label><textarea style"width: 700px; height: 56px" max="255"></textarea>');
newTextBoxDiv.appendTo("#TextBoxesGroup");
counter++;
});
$("#removeButton").click(function () {
if(counter==2){
alert("This is the last area it cannot be removed from the form.");
return false;
}
counter--;
$("#TextBoxDiv" + counter).remove();
});
});
</script>
</head>
<body>
<div class="total">
<fieldset><legend>Action Items:</legend>
<div id='TextBoxesGroup'>
<div id="TextBoxDiv1">
<label> 1 : </label><textarea style="width: 700px; height: 56px" max="255"></textarea>
</div>
</div>
<input type='button' value='Add Button' id='addButton'>
<input type='button' value='Remove Button' id='removeButton'>
</body>
</html>
最佳答案
你改变这句话
newTextBoxDiv.after().html('<label>'+ counter + ' : </label><textarea style"width: 700px; height: 56px" max="255"></textarea>')
之后...
newTextBoxDiv.after().html('<label>'+ counter + ' : </label><textarea style"width: 760px; height: 56px" rows="5" style="width: 764px">')
关于Javascript 添加文本区域大小，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16471515/