设置jQuery中的textarea值

我试图用jquery在textarea字段中设置一个值，代码如下:

$("textarea#ExampleMessage").attr("value", result.exampleMessage);

问题是，一旦这段代码执行，它不改变文本区域的文本?

然而，当执行alert($("textarea#ExampleMessage").attr("value"))时，新设置的值返回?

1058299 次浏览
小开
最佳答案

你找过瓦尔吗?

$("textarea#ExampleMessage").val(result.exampleMessage);
小开

我认为这是可行的:

$("textarea#ExampleMessage").val(result.exampleMessage);
小开

Textarea没有值属性，它的值在标签之间，即:<textarea>my text</textarea>，它不像输入字段(<input value="my text" />)。这就是为什么attr不工作:)

小开

它为我工作.... 我建了一个脸书墙…

下面是我的代码的基础:

// SETS MY TEXT AREA TO EMPTY (NO VALUE)
$('textarea#message_wall').val('');
小开

哦，来吧，男孩们!它只适用于

$('#your_textarea_id').val('some_value');
小开

我也有同样的问题，这个解决方案不工作，但工作的是使用html

$('#your_textarea_id').html('some_value');
小开

我尝试用.val() .text() .html()和有一些bug使用jQuery读取或设置文本区域的值…我最终使用原生js

$('#message').blur(function() {
if (this.value == '') { this.value = msg_greeting; }
});
小开

使用$("textarea#ExampleMessage").html('whatever you want to put here');可能是一种好方法，因为在使用数据库中的数据时.val()可能会出现问题。

例如:

名为description的数据库字段的值为asjkdfklasdjf sjklñadf。在这种情况下，使用.val()为textarea赋值可能是一项乏味的工作。

小开

$("textarea#ExampleMessage").val()在jquery只是一个魔术。

您应该注意到，文本区域标记使用内心的html来显示，不在值属性中就像输入标记一样。

<textarea>blah blah</textarea>
<input type="text" value="blah blah"/>

你应该使用

$("textarea#ExampleMessage").html(result.exampleMessage)

或

$("textarea#ExampleMessage").text(result.exampleMessage)

这取决于您是想将其显示为HTML标记还是纯文本。

小开

有问题:我需要从一个给定的div的包含生成html代码。然后，我必须把这个原始的html代码在一个文本区域。当我像这样使用$(textarea).val()函数时:

$(textarea).val("some html like < input type='text' value='' style="background: url('http://www.w.com/bg.gif') repeat-x center;" /> bla bla");

或

$('#idTxtArGenHtml').val( $('idDivMain').html() );

我有一些特殊的字符( & ' " )的问题，当他们之间quot。但是当我使用这个函数时: $(textarea).html()文本是ok的

这里有一个表单示例:

<FORM id="idFormContact" name="nFormContact" action="send.php" method="post"  >
<FIELDSET id="idFieldContact" class="CMainFieldset">
<LEGEND>Test your newsletter&raquo; </LEGEND>
<p>Send to &agrave; : <input id='idInpMailList' type='text' value='youremail@gmail.com' /></p>
<FIELDSET  class="CChildFieldset">
<LEGEND>Subject</LEGEND>
<LABEL for="idNomClient" class="CInfoLabel">Enter the subject: *&nbsp</LABEL><BR/>
<INPUT value="" name="nSubject" type="text" id="idSubject" class="CFormInput" alt="Enter the Subject" ><BR/>
</FIELDSET>
<FIELDSET  class="CChildFieldset">
<INPUT id="idBtnGen" type="button" value="Generate" onclick="onGenHtml();"/>&nbsp;&nbsp;
<INPUT id="idBtnSend" type="button" value="Send" onclick="onSend();"/><BR/><BR/>
<LEGEND>Message</LEGEND>
<LABEL for="idTxtArGenHtml" class="CInfoLabel">Html code : *&nbsp</LABEL><BR/>
<span><TEXTAREA  name="nTxtArGenHtml" id="idTxtArGenHtml" width='100%' cols="69" rows="300" alt="enter your message" ></TEXTAREA></span>
</FIELDSET>
</FIELDSET>
</FORM>

和javascript/jquery代码，不工作填充文本区域是:

function onGenHtml(){
$('#idTxtArGenHtml').html( $("#idDivMain").html()  );
}

最后解决方案:

function onGenHtml(){
$('#idTxtArGenHtml').html( $("#idDivMain").html() );
$('#idTxtArGenHtml').parent().replaceWith( '<span>'+$('#idTxtArGenHtml').parent().html()+'</span>');
}
这个技巧是用span标记来包装你的文本区域，以帮助replaceWith函数。 我不确定它是否非常干净，但它的工作完美太添加原始html代码在文本区域
小开

只需使用这段代码，你将永远有值:

< p > <代码> Var t = $(this); Var v = t.val() || t.html() || t.text(); < /代码> < / p >

所以它会检查val()并设置它的值。如果val()得到一个空字符串，NULL, NaN o.s.，它将检查html()，然后检查text()…

小开

我也有同样的问题，所以我决定在当前的浏览器中尝试一下(我们在这个问题后的时间上晚了一年半)，这(.val)是有效的

$("textarea#ExampleMessage").val(result.exampleMessage);

为

  • IE8
  • FF 3.6
  • FF4
  • Opera 11
  • Chrome 10
小开

Textarea不存储值为

<textarea value="someString">

相反，它以以下格式存储值:

<textarea>someString</textarea>

所以attr("value","someString")会得到这样的结果:

<textarea value="someString">someOLDString</textarea>.

试试$("#textareaid").val()或$("#textareaid").innerHTML。

小开

如此:

var t = $('#taCommentSalesAdministration');
t.val('Hi');
记住，这里棘手的部分是确保你使用了正确的ID。 在你使用ID之前，确保你把#放在它前面。< / p >
小开

您甚至可以使用下面的代码片段。

$("textarea#ExampleMessage").append(result.exampleMessage);
小开

接受的答案对我来说是可行的，但这是在我意识到必须在页面加载完成后执行代码之后。在这种情况下，内联脚本不起作用，我猜是因为#my_form还没有加载完成。

$(document).ready(function() {
$("#my_form textarea").val('');
});
小开

我们可以使用.val()或.text()方法来设置值。我们需要像val("hello")一样在val()中放入值。

  $(document).ready(function () {
$("#submitbtn").click(function () {
var inputVal = $("#inputText").val();
$("#txtMessage").val(inputVal);
});
});

检查示例:http://www.codegateway.com/2012/03/set-value-to-textarea-jquery.html

小开

当我在页面中使用JQuery v1.4.4时，这两种方法都不起作用。当将JQuery v1.7.1注入到我的页面时，它终于工作了。所以在我的例子中，是我的JQuery版本导致了这个问题。

Id ==> textareaid

======================

var script1 = document.createElement("script");
script1.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js";
document.body.appendChild(script1);


var script2 = document.createElement("script");
script2.type = "text/javascript";
script2.innerHTML = "var $jq171 = $.noConflict();";
document.body.appendChild(script2);


$jq171('#textareaid').val('xxx');
小开

文本区域没有值。jQuery .html()在这种情况下工作

$("textarea#ExampleMessage").html(result.exampleMessage);
小开

要设置编码HTML的文本区域值(显示为HTML)，您应该使用.html( the_var )，但如前所述，如果您尝试再次设置它可能(很可能)将无法工作。

你可以通过清空文本区域.empty()来修复这个问题，然后再次设置为.html( the_var )

这是一个工作的JSFiddle: # EYZ0 < / p >

. 
jQuery(function($){
    

$('.load_html').click(function(){
var my_var = $(this).data('my_html');
$('#dynamic_html').html( my_var );
});
    

$('#clear_html').click(function(){
$('#dynamic_html').empty();
});
    

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<textarea id="dynamic_html"></textarea>
<a id="google_html" class="load_html" href="#" data-my_html="&lt;a href=&quot;google.com&quot;&gt;google.com&lt;/a&gt;">Google HTML</a>
<a id="yahoo_html" class="load_html" href="#" data-my_html="&lt;a href=&quot;yahoo.com&quot;&gt;yahoo.com&lt;/a&gt;">Yahoo HTML</a>
<a id="clear_html" href="#">Clear HTML</a>

小开

在android上.val和.html不工作。

$('#id').text("some value")

完成了任务。

小开

只需要按它的类型使用textarea Id:

$("textarea#samplID").val()
小开

我认为这里缺少一个重要的方面:

$('#some-text-area').val('test');

只有当有ID选择器(#)时才有效

对于类选择器，有一个选项可以使用本机值，如:

$('.some-text-area')[0].value = 'test';
小开

我已经使用$(textarea).val/html/text(any_str_var)所有工作为我。 如果你想确保你的变量作为一个字符串被添加到文本区域，你总是可以这样concat:

$(textarea).val(unknown_var + '')

.val()方法肯定用于textarea -见:https://api.jquery.com/val/

.html()可以用来获取或设置任何元素的内容-参见:https://api.jquery.com/html/#html2

.text()与.html相同，除了它可以用来设置XML内容:参见- https://api.jquery.com/text/#text-text

您还可以阅读更多关于每个链接如何处理特殊字符的信息。

小开
我已经尝试使用JQuery设置值/文本/ html，但不成功。

在这种情况下，我注入新的textarea元素后DOM创建。

 var valueToDisplay= 'Your text here even with line breaks';
var textBox = '<textarea class="form-control" >'+ valueToDisplay +'</textarea>';
$(td).html(textBox);

enter image description here

小开

添加到上面一些很棒的👍答案，在使用多表单并且元素NAME是您想要的目标的情况下。

$('textarea[name=ExampleMessageElName]').val('Some Message here');
小开

在我的情况下，我有这个输入在iframe，任何上述解决我的问题，但这个:

我是这样解的:

$('#myId')[0].value="MY VALUE";

我的输入字段:

<textarea name="cmyInput" rows="2" cols="20" id="myId" class="nd" ignoreautotab="1"></textarea>
小开

通过jQuery编辑文本区域内的文本使用$(id).html。

<textarea id="descricao2" name="descricao2" class="form" style="width:600px;height: 130px;"></textarea>


$("#descricao2").html("hello");

提交答案