Javascript添加textarea的大小
Javascript adding textarea size
我有一个表单,它有一个文本区,包括几个按钮,我将添加一个额外的文本区,另一个将删除一个文本区,除非它是最后一个。它的工作原理,除了我想要每个文本区域的大小与原来的一样,但我只是无法找出我做错了什么。
<!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">')
这是一个小bug,但是你在JavaScript中的style
属性之后缺少=
。(演示)
改变:
newTextBoxDiv.after().html('<label>'+ counter + ' : </label><textarea style"width: 700px; height: 56px" max="255"></textarea>');
:
newTextBoxDiv.after().html('<label>'+ counter + ' : </label><textarea style="width: 700px; height: 56px" max="255"></textarea>');
一个更简洁的方法是使用CSS来设置你的<textarea>
元素的样式,像这样:
textarea.Wide {
width: 700px;
height: 56px
}
然后你可以修改你的HTML(和JavaScript)如下:
<textarea class="Wide" max="255"></textarea>
相关文章:
- 正在添加'X'按钮,在文本字段旁边使用javascript
- 如何在映射数组中添加换行符
- 正在将数据主题添加到所有项目
- ZeroClipboard-在复制之前添加到值
- 将文本和html unicode字符添加到textarea元素中
- 使用 JQuery 和 append() 将包含空格的文本数组添加到 TextArea 中
- Jquery(input/textarea).val():如何在不更改DOM的情况下添加内容
- 如何在textarea标记中添加正则表达式
- 使用textarea-tinymce插件管理动态添加和删除元素
- jQuery帮助在Textarea中添加和删除元素
- 如何为textarea字段的代码添加换行?
- 如何在按键上向textArea添加字符
- Javascript添加textarea的大小
- Javascript复选框添加值Textarea
- Jquery textarea在文本中添加链接
- 自动完成需要在javascript添加textarea
- jQuery函数(添加一些文本到textarea)
- 如何使用Javascript在光标位置的TextArea中添加文本
- 在textarea中添加新行
- 点击列表框,用javascript在textarea中添加选中的项目名称