jQuery获取textarea中的内容_jquery textarea-CSDN博客

本文链接：https://blog.csdn.net/weixin_45438997/article/details/112832918

本文介绍了如何使用jQuery获取textarea中的内容。讲解了通过.val()、.text()和.html()方法的区别，指出通过.id选择器配合.val()适用于获取textarea的修改后内容，而.text()和.html()只能获取初始内容。并提供了相应的代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

查阅资料可知:

jQuery的.val()方法是专门用来获取表单元素值的，而textarea也属于表单元素所以可以直接用.val()方法获取。
由于textarea是个双标记，因此.text()或.html()方法也可以获取到其中的信息。

经过我们实际的测试发现；

1.我们通过给textarea元素设置id，通过id查找到元素获取val的方式行不通。详情见代码。具体原因还未查找到，有了解的码友请指点一二。

2.通过jQuery的选择器查找到元素，通过.val()的方法可以获取到初始的textarea的内容，也可以获取到修改以后的textarea的内容。

3.通过jQuery的选择器查找到元素，通过.text()的方法只能获取到初始的textarea的内容。

4.通过jQuery的选择器查找到元素，通过.html()的方法只能获取到初始的textarea的内容。

综上所属：通过jQuery获取textarea新输入的内容时，需要使用筛选器和.val()组合进行获取。通过jQuery获取textarea默认的内容时，需要使用筛选器和.text()组合进行获取或使用筛选器和.html()组合进行获取。

代码段如下:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>获取textarea内容</title>
</head>
<body>
    <div class="title">
        <span class="xinghao">*</span>
        内容描述
    </div>
    <textarea name="remark" id="remark" rows="8" placeholder="请您输入作品概述" class="content">123456</textarea>
	<div class="btn-container" onclick="onSubmte()">获取textArea内容</div>
</body>

<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
<script>
    function onSubmte() {
        console.log("remark:", $("#remark").val()) //remark: undefined
        console.log("remark:",$("textarea[name=remark]").val()) // remark: 123456
        console.log("remark:",$("textarea[name=remark]").text()) // remark: 1234
        console.log("remark:",$("textarea[name=remark]").html()) // remark: 1234
    }
</script>
</html>