Question

我试图将两个文本区域连接成一个段落。两个文本区域是用户可以输入数据然后按下按钮并将结果显示在段落中的位置。

我无法弄清楚为什么我不能将两个文本区域连接成段落html元素。我确实知道我可以使用相同的功能将结果显示在另一个文本区域中但是当我将元素切换回段落时...＆＃34; p＆＃34;而不是＆＃34; textarea＆＃34;我的代码不再正常运行。

的javascript：

function concatenate(){
    document.getElementById("result1").value =
    document.getElementById("text_area_1").value + " " +
    document.getElementById("text_area_2").value;
}

HTML：

<div id="requirement #1">
    <h1> Requirement #1</h1>
    <textarea id="text_area_1"></textarea>
    <textarea id="text_area_2"></textarea>
    <button type="button" id="button1" onclick="concatenate()">concatenate</button>
    <p id="result1"></p
</div>

我不知道为什么我改变了＆＃34; p＆＃34;到了＆＃34; textarea＆＃34;元素我的功能工作，但当我使用＆＃34; p＆＃34;标签，它不起作用。我认为它可能与使用＆＃34; .value＆＃34;的document.getElementById（...）有关。？也许我应该用别的东西？

Answer 1

result1没有value属性。它不是一个字段，而是HTMLParagraphElement。请改用result1.innerHTML。

当然，您可能希望HTML转义textarea的内容，这样您就不会意外破坏自己的页面，在这种情况下，您应该使用result1.textContent。

Answer 2

您没有正确设置'result1'的值。

试试这个：

function concatenate(){
    //I modified this line, changed .value for .innerHTML
    document.getElementById("result1").innerHTML =
    document.getElementById("text_area_1").value + " " +
    document.getElementById("text_area_2").value;
}

<div id="requirement #1">
    <h1> Requirement #1</h1>
    <textarea id="text_area_1"></textarea>
    <textarea id="text_area_2"></textarea>
    <button type="button" id="button1" onclick="concatenate()">concatenate</button>
    <p id="result1"></p
</div>

如何将两个文本区域连接成一个段落

2 个答案: