jQueryでtextareaの値を設定する

次のコードでjqueryを使用してtextareaフィールドに値を設定しようとしています：

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

問題は、このコードが実行されると、textareaのテキストが変更されないことです。

しかしalert($("textarea#ExampleMessage").attr("value"))、新しく設定した値を実行すると返されますか？

valを試しましたか？

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

Textareaにはvalue属性がありません。その値はタグの間にあります。つまり<textarea>my text</textarea>、入力フィールド（<input value="my text" />）とは異なります。それがattrが機能しない理由です:)

$("textarea#ExampleMessage").val() jqueryではただの魔法です。

内側のhtmlを使用して表示するtextareaタグは、 inputタグのようにvalue属性ではないことに注意してください。

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

あなたは使うべきです

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

または

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

HTMLタグとして表示するか、プレーンテキストとして表示するかによって異なります。

男の子に来て！それだけで動作します

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

これはうまくいくと思います：

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

同じ質問があったので、現在のブラウザーで試してみることにしました（この質問の後、1年半後です）。これは（.val）で機能します

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

ために

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

Android上.valと.html動作しませんでした。

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

仕事をしました。

同じ問題があり、このソリューションは機能しませんでしたが、機能したのはhtmlを使用することでした

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

そこで問題があります：与えられたdivの包含からhtmlコードを生成する必要があります。次に、この未加工のhtmlコードをtextareaに配置する必要があります。次のように関数$（textarea）.val（）を使用すると：

$（textarea）.val（ "<input type = 'text' value = ''のようないくつかのhtml style =" background：url（ 'http://www.w.com/bg.gif'）repeat-x center; "/> bla bla"）;

または

$（ '＃idTxtArGenHtml'）。val（$（ 'idDivMain'）。html（））;

クォートの間にある特殊文字（＆ '"）に問題がありましたが、関数$（textarea）.html（）を使用すると、テキストは大丈夫です。

フォームの例があります：

<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>

そして、textareaを埋めるように機能しないjavascript / jqueryコードは次のとおりです。

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

最後にソリューション：

function onGenHtml(){
  $('#idTxtArGenHtml').html( $("#idDivMain").html() );
  $('#idTxtArGenHtml').parent().replaceWith( '<span>'+$('#idTxtArGenHtml').parent().html()+'</span>');
}

コツは、replaceWith関数を支援するために、textareaをspanタグでラップすることです。とてもきれいかどうかはわかりませんが、テキストエリアに未加工のhtmlコードを追加することもできます。

textareaは値を次のように保存しません

<textarea value="someString">

代わりに、次の形式で値を保存します。

<textarea>someString</textarea>

だからattr("value","someString")あなたはこの結果を得る：

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

$("#textareaid").val()または$("#textareaid").innerHTML代わりにしてみてください。

テキスト領域に値がありません。この場合、jQuery .html（）が機能します

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

それは私のために働きます...私はフェイスブックの壁を作りました...

これが私のコードの基礎です：

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

エンコードされたHTMLのtextarea値を設定するには（HTMLとして表示するため）を使用する必要があります.html( the_var )が、前述のようにもう一度設定すると、機能しない可能性があります（おそらく）。

これを修正するには、textarea .empty()を空にしてから再度設定します.html( the_var )

これが動作しているJSFiddleです：https ://jsfiddle.net/w7b1thgw/2/

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>

私は試してみましたが.val() .text() .html()、jQueryを使用してtextareaの値を読み取ったり設定したりするためにいくつかのバグがありました...結局、ネイティブjsを使用しています

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

.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

そのようなタイプでtextarea Idを使用するだけです：

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

重要な側面が1つ欠けていると思います。

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

IDセレクター（＃）がある場合にのみ機能します

クラスセレクターには、次のようなネイティブ値を使用するオプションがあります。

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

受け入れられた回答は私にとってはうまくいきますが、ページの読み込みが完了した後にコードを実行する必要があることに気付いたときのみです。この状況では、インラインスクリプトは機能しませんでした。＃my_formの読み込みがまだ完了していないためです。

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

以下のスニペットを使用することもできます。

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

ページに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');

私は私のために$(textarea).val/html/text(any_str_var)働いたすべてを使いました。変数を文字列としてtextareaに確実に追加したい場合は、いつでも次のように連結できます。

$(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を参照してください。

また、各リンクを使用して、それぞれが特殊文字にどのように作用するかについても詳しく読むことができます。

このコードを使用するだけで、常に値が得られます。

var t = $(this); var v = t.val() || t.html() || t.text();

したがって、val（）をチェックしてその値を設定します。val（）が空の文字列、NULL、NaN osを取得した場合、html（）をチェックしてから、text（）をチェックします...

これは機能します：

var t = $('#taCommentSalesAdministration');
t.val('Hi');

ここで注意が必要なのは、正しいIDを使用することです。そして、IDを使用する前に、IDの#前に置いてください。

データベースのデータを使用しているときに問題が発生する可能性がある$("textarea#ExampleMessage").html('whatever you want to put here');ため、を使用することは良い方法.val()です。

例えば：

asという名前のデータベースフィールドにdescriptionは、次の値がありますasjkdfklasdjf sjklñadf。この場合、.val（）を使用してtextareaに値を割り当てるのは、面倒な作業になる可能性があります。

JQueryを使用して値/テキスト/ htmlを設定しようとしましたが、成功しませんでした。だから私は以下を試しました。

この場合、DOMが作成された後に新しいtextarea要素を挿入していました。

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