textarea 的 val() 与 text()答案

【问题标题】：val() vs. text() for textareatextarea 的 val() 与 text()
【发布时间】：2012-02-09 21:01:17
【问题描述】：

我正在使用 jQuery，想知道是否应该使用 val() 或 text()（或其他方法）来读取和更新 textarea 的内容。

我都试过了，但我都遇到了问题。当我使用 text() 更新 textarea 时，换行符 (\n) 不起作用。当我使用 val() 检索 textarea 内容时，如果文本太长，文本会被截断。

【问题讨论】：

换行不起作用是什么意思？
@kaz：文本保持在同一行。
在控制台的调试输出中，“文本被截断”是什么意思？在返回值本身？如果你提供一个 jsfiddle 会更容易......
@Connum: 在返回值中。现在正在尝试 jsfiddle...
我是通过谷歌搜索到这里的截断文本区域文本。我通过在 .val() 末尾添加几个 \n\n 来解决我的问题。很奇怪，但它奏效了。

标签： jquery forms textarea

【解决方案1】：

设置/获取文本区域值的最佳方法是.val()、.value 方法。

.text() 在内部使用.textContent（或IE 的.innerText）方法来获取<textarea> 的内容。以下测试用例说明了text() 和.val() 之间的关系：

var t = '<textarea>';
console.log($(t).text('test').val());             // Prints test
console.log($(t).val('too').text('test').val());  // Prints too
console.log($(t).val('too').text());              // Prints nothing
console.log($(t).text('test').val('too').val());  // Prints too

console.log($(t).text('test').val('too').text()); // Prints test

.val() 使用的value 属性总是显示当前可见值，而text() 的返回值可能是错误的。

【讨论】：

谢谢，现在就试试。我目前无法复制 val() 和截断的问题。也许我抓错了嫌疑人……
非常感谢您提供的示例。显然这是我的问题，我用 text() 写，用 val() 阅读。
使用 text() 更改文本区域的值在手动更改其中的任何内容（例如添加字符）后不再起作用

【解决方案2】：

.val() 始终适用于 textarea 元素。

.text() 有时有效，有时失败！不可靠（在 Chrome 33 中测试）

最好的是.val() 也可以与其他表单元素无缝协作（如input），而.text() 则失败。

【讨论】：