使用Javascript添加到文本区域中的现有文本

我需要一个“添加功能”按钮，将以下文本附加到文本区域中已存在的文本：

<b>Features:</b>
<ul>
<li>Feature 1 here</li>
<li>Feature 2 here</li>
</ul>

功能：

这里是功能1
这里是功能2

它需要以html格式显示，以便用户可以看到标记及其内容。以下是我正在使用的HTML：

<tr class="addItemFormDark">
    <td class="descriptionLabel">
        <p>Description:</p>
    </td>
    <td>
        <textarea name="description" id="addItemDescription" cols="77" rows="6"></textarea>
    </td>
</tr>
<tr class="addItemFormDark">
    <td colspan="2">
        <input type="button" onclick="addFeatures('addItemDescription')" value="Add Features"/>
    </td>
</tr>

function addFeatures(id) {
    var contents = document.getElementById(id).innerHTML;
    contents += "<b>Features:</b>\r<ul>\r\t<li>Feature 1 here</li>\r\t<li>Feature 2 here</li>\r</ul>";
    document.getElementById(id).innerHTML = contents;
}

说明：

…下面是我正在使用的JavaScript：

<tr class="addItemFormDark">
    <td class="descriptionLabel">
        <p>Description:</p>
    </td>
    <td>
        <textarea name="description" id="addItemDescription" cols="77" rows="6"></textarea>
    </td>
</tr>
<tr class="addItemFormDark">
    <td colspan="2">
        <input type="button" onclick="addFeatures('addItemDescription')" value="Add Features"/>
    </td>
</tr>

function addFeatures(id) {
    var contents = document.getElementById(id).innerHTML;
    contents += "<b>Features:</b>\r<ul>\r\t<li>Feature 1 here</li>\r\t<li>Feature 2 here</li>\r</ul>";
    document.getElementById(id).innerHTML = contents;
}

功能添加功能（id）{
var contents=document.getElementById（id）.innerHTML；
contents+=“功能：\r
\r\t
功能1此处
\r\t
功能2此处
\r
”；
document.getElementById（id）.innerHTML=contents；
}

这是我遇到麻烦的部分。如果textarea是空的，正如它开始时一样，所需的文本将被添加到textarea fine，并且这可以重复多次，每个文本块在最后一个文本块之后被成功添加

但是，如果用户在框中键入任何内容，无论是在空文本区域中，还是在成功添加所需的代码块后，这将完全禁用按钮。在刷新页面之前，它将不再向文本区域添加任何内容

如果我使用JQuery的.append方法并给textarea和button一个id，我会得到完全相同的结果

---

有人能帮忙吗？

innerHTML

不是用于设置textarea值的正确属性。使用

值

function addFeatures(id) {
    var textarea = document.getElementById(id);
    textarea.value += "<b>Features:</b>\r<ul>\r\t<li>Feature 1 here</li>\r\t<li>Feature 2 here</li>\r</ul>";
}

功能添加功能（id）{
var textarea=document.getElementById（id）；
textarea.value+=“功能：\r
\r\t
功能1此处
\r\t
功能2此处
\r
”；
}

innerHTML

不是用于设置textarea值的正确属性。使用

值

function addFeatures(id) {
    var textarea = document.getElementById(id);
    textarea.value += "<b>Features:</b>\r<ul>\r\t<li>Feature 1 here</li>\r\t<li>Feature 2 here</li>\r</ul>";
}

功能添加功能（id）{
var textarea=document.getElementById（id）；
textarea.value+=“功能：\r
\r\t
功能1此处
\r\t
功能2此处
\r
”；
}

对于jquery，我将使用以下方法：

var appendData = //the HTML text you want to add
var currentData = $("#textboxID").val();
var newData = currentData+appendData;

$("#textboxIS").val(newData);

---

对于jquery，我将使用以下方法：

var appendData = //the HTML text you want to add
var currentData = $("#textboxID").val();
var newData = currentData+appendData;

$("#textboxIS").val(newData);

---

使用

.value

而不是.innerHTML来获取/设置textarea的值。使用

.value

而不是.innerHTML来获取/设置textarea的值。这是一个很好的解决方案，我现在已经实现了它。谢谢：）这是一个很好的解决方案，我现在已经实现了它。谢谢：）