如何在 jquery 中获取 textarea 的值？答案

【问题标题】：how to get the value of a textarea in jquery?如何在 jquery 中获取 textarea 的值？
【发布时间】：2012-05-17 10:46:47
【问题描述】：

我有这个表格，我试图从文本区域获取值。由于某种原因它不想这样做。

<form action="/profile/index/sendmessage" method="post" enctype="application/x-www-form-urlencoded">
    <div class="upload_form">
        <dt id="message-label"><label class="optional" for="message">Enter Message</label></dt>
        <dd id="message-element">
        <textarea cols="60" rows="5" id="message" name="message"></textarea></dd>
        <dt id="id-label">&nbsp;</dt>
        <dd id="id-element">
        <input type="hidden" id="id" value="145198" name="id"></dd>
        <dt id="send_message-label">&nbsp;</dt>
        <dd id="send_message-element">
        <input type="submit" class="sendamessage" value="Send" id="send_message" name="send_message"></dd>
    </div>
</form>


$("input.sendamessage").click(function(event) {
    event.preventDefault();

    var message = $('textarea#message').html();
    var id      = $('input#id').val();

    console.log(message + '-' + id);
});

或jsfiddle

有什么想法吗？

【问题讨论】：

标签： javascript jquery textarea

【解决方案1】：

textarea 的值也是用val 方法获取的：

var message = $('textarea#message').val();
console.log(message);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea cols="60" rows="5" id="message" name="message">
Hello,
 world!
</textarea>

【讨论】：

【解决方案2】：

您需要将.val() 用于textarea，因为它是一个元素而不是包装器。试试

$('textarea#message').val()

Updated fiddle

【讨论】：

【解决方案3】：

您应该使用val() 而不是html()

var message = $('#message').val();

【讨论】：

【解决方案4】：

在javascript中：

document.getElementById("message").value

【讨论】：

来自Mozilla's documentation：“<textarea> 不支持value 属性。”
@CristianCiupitu：没有人在谈论textarea元素的属性，它是关于检索元素的内容。
@Forage 那么.value 是什么意思？
@CristianCiupitu：就像我说的那样，Saurabh 会为您提供textarea 元素的内容，即某人在字段中键入的文本。如果一个元素（如input）具有value 属性，您可以使用document.getElementById("message").getAttribute("value") 检索它。
@Forage 仅仅因为它在相同的情况下工作，并不能使它正确。或者，也许您应该报告 Mozilla 文档的问题。

【解决方案5】：

你不需要使用textarea#message

var message = $('textarea#message').val();

可以直接使用

var message = $('#message').val();

【讨论】：

【解决方案6】：

你应该在使用 val() 之前检查 textarea 是否为空，否则你会得到未定义的错误。

if ($('textarea#message') != undefined) {
   var message = $('textarea#message').val();
}

然后，你可以对消息做任何事情。

【讨论】：

这是不正确的。 jQuery 永远不会为任何查询返回 undefined。相反，它返回一个空集。但是，对空集调用 val 会返回未定义，但您的答案并不能解决此问题。

【解决方案7】：

可以直接使用

var message = $.trim($("#message").val());

【讨论】：

【解决方案8】：

也可以通过元素的name属性获取值。

var message = $("#formId textarea[name=message]").val();

【讨论】：

【解决方案9】：

$('textarea#message') 不能是未定义的（如果 $ 你的意思当然是 jQuery）。

$('textarea#message') 的长度可能为 0，然后 $('textarea#message').val() 将为空，仅此而已

【讨论】：

【解决方案10】：

所有值始终使用.val()。

见下面的代码：

var message = $('#message').val();

【讨论】：

【解决方案11】：

您不需要使用.html()。你应该选择.val()。

来自.val()的文档：

.val()方法主要用于获取input、select、textarea等表单元素的值。在空集合上调用时，它返回undefined。

var message = $('#message').val();

【讨论】：

【解决方案12】：

您也可以像这样通过名称而不是 id 来获取值：

var message = $('textarea:input[name=message]').val();

【讨论】：