javascript - 获取表单内 textarea 的值

Question

我想在表单内获取此 textarea 的值，然后使用 javascript 将该值复制到表单外的另一个 textarea 中。我该怎么做？这是我的文本区域...

<form>
    <textarea id="tpName" name="tpName" onchange="tpName(this)" style="margin-top: -9px; width: 275px; height: 40px;"></textarea>
</form>

<textarea id="copytpName" name="copytpName" style="margin-top: -9px; width: 275px; height: 40px;"></textarea>

每当我在表单内的 textarea 中键入一个值时，我也想更新表单外的 textarea 的值。

Answer 1

你可以在javascript中这样做，

HTML

<form>
<textarea id="tpName" name="tpName" onkeyup="copyThis(this);" style="margin-top: -9px; width: 275px; height: 40px;"></textarea>
</form>

<textarea id="copytpName" name="copytpName" style="margin-top: -9px; width: 275px; height: 40px;"></textarea>

JAVASCRIPT

function copyThis(txObj) {
    document.getElementById("copytpName").value = txObj.value;   
}

注意：您需要更改函数名称。函数名称与 textarea 名称匹配，因此它会在您的情况下创建问题。

试试这个http://jsfiddle.net/CZCnx/2/

Answer 2

正如其他一些人在他们的答案中发布的那样，不需要 jQuery。只需不要将您的函数命名为与 ID 和表单名称相同的名称，它就可以工作：

jsFiddle 示例

<form>
    <textarea id="ttpName" name="ttpName" onchange="tpName(this)" style="margin-top: -9px; width: 275px; height: 40px;"></textarea>
</form>
<textarea id="copytpName" name="copytpName" style="margin-top: -9px; width: 275px; height: 40px;"></textarea>
function tpName(data) {
    document.getElementById("copytpName").value = data.value;
}

我将您的文本区域更改为<textarea id="ttpName" name="ttpName" ...

Answer 3

我会试试这个：

var text = document.getElementById("tpName").value;

$("#copytpName").attr("value", text);

Answer 4

我在这里添加了代码，它使用 jquery

http://jsfiddle.net/5B6KC/1/

代码：

$("#tpName").keyup(function(){
    $("#copytpName").val($(this).val());
})