• ベストアンサー

JavaScript内でエレメントを設定したいがPHPが間にある場合

html(phpファイル内)抜粋 textarea name='textRmks["+nextRow+"]' cols='100' rows='5'><?=$teststr;?></textarea> これをJavascript内でエレメントを使って設定したいのですが PHPの<?=$teststr;?>部分の書き方がわからずだいぶ悩んでます。 var ipt = fm.createElement("<textarea name='tRmk["+cnt+"]' cols='100' rows='5'><--ここ?-->"); どなたか教えてください。

質問者が選んだベストアンサー

  • ベストアンサー
  • mr_araki
  • ベストアンサー率85% (12/14)
回答No.2

textareaを動的に作成したいってことかな? 以下のソースを参考にしてください textareaオブジェクトのvalueに指定した値が中に表示されます。 他のフォームオブジェクトも基本的に同じです ※エレメントの参照方法とか値の設定方法がブラウザによって動作しない可能性があるので、各ブラウザ用の方法を探してみてください。 <html> <head> <title>textarea test</title> <script type="text/javascript"> onload = function() {   var textarea = document.createElement('textarea');   textarea.setAttribute('id', 'textarea1')   textarea.setAttribute('cols', '100')   textarea.setAttribute('rows', '10')   textarea.setAttribute('value', 'text text text text')   document.form1.appendChild(textarea) } </script> </head> <body> <form name="form1" id="form1"></form> </body> </html>

9pinkapple
質問者

お礼

できました。 つたない文章から読み取って頂きありがとうございました。 助かりました。

全文を見る
すると、全ての回答が全文表示されます。

その他の回答 (2)

回答No.3

ipt=document.createElement('<textarea name="tRmk['+cnt+']">'); if(!ipt) ipt=document.createElement('textarea'); ipt.name='tRmk['+cnt+']'; ipt.cols='100'; ipt.rows='5'; ipt.value="<?=$teststr;?>"; //これ 未検証です。 やってることは他の人のsetAttribute()と同じです。 XHTMLにするならdocument.createElementNS()を使用。 厳密にはIEはcreateElementNS()未対応で、createElement()と同じ動作になります。 Content-Typeヘッダをtext/htmlにしてcreateElementNSかsetAttributeNSを使うと、IE6がフリーズ or クラッシュ nameをセットしないと、フォームを送信してもtextareaの内容が送信されません。 IEでname属性が付与できない問題があるので、name付きでcreateElementしてます。 どのタグでname属性が付いて、どのタグで付かないのかまではまだ調べていませんが、 もしかするとtextareaは"name属性を付けられる要素"かもしれません。

9pinkapple
質問者

お礼

こちらも思いの動作をしました。 2通りの書き方があるのですね。 同文になりますが、つたない文章から読み取って頂き ありがとうございました。助かりました。

全文を見る
すると、全ての回答が全文表示されます。
回答No.1

●fm.createElement("<textarea name='tRmk["+cnt+"]' cols='100' rows='5'><--ここ?-->") という構文はDOM規格上存在しない。 IEが勝手に動作するだけ。 application/xhtml+xmlで配布し、IEの対応を切り捨てるなら 各条件分岐の2番目以降は必要ない。 その場合script要素のtype属性はtext/javascriptでなく, application/ecmascriptに書き換えるべきだろう。 ●サーバ側でPHPが解釈された後,クライアントにわたる(Ecmascriptで解釈)と考えよう。サーバで処理後の結果は「ソースを表示」で確認できる ============================================ <?php // header("Content-Type:application/xhtml+xml;charset=UTF-8"); header("Content-Type:text/html;charset=UTF-8"); $teststr = "Q3611556のテストだよ"; ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Q3611556 TestCase 1</title> <script type="text/javascript"> //<![CDATA[ function hoge(){ var returnvalue = false; var ipt = null; for (var cnt = 0;cnt < 5; cnt++ ){ if(typeof(document.createElementNS) != "undefined"){ ipt = document.createElementNS("http://www.w3.org/1999/xhtml","textarea"); }else if(typeof(document.createElement) != "undefined"){ ipt = document.createElement("textarea"); }else{ ipt = null; returnvalue = false; } if (ipt != null){ ipt.setAttribute("name","tRmk["+cnt+"]"); //あまり好きではないがPHPの動作上必要っぽいね。 ipt.setAttribute("cols","100"); ipt.setAttribute("rows","5"); if(typeof(ipt.textContent) != "undefined"){ ipt.textContent = "<?=$teststr;?>"; returnvalue = true; }else if(typeof(ipt.innerText) != "undefined"){ ipt.innerText = "<?=$teststr;?>"; returnvalue = true; }else{ returnvalue = false; } document.getElementById("Q3611556A").appendChild(ipt); } } } //]]> </script> </head> <body onload="hoge();"> <p id="Q3611556A"></p> </body> </html>

9pinkapple
質問者

お礼

js内で、"<?=$teststr;?>"が反応してくれません。 書き方がまずいのか腑に落ちませんが 参考になりました。ありがとうございました。

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • 記号()が混ざった正規表現について

    さらに、申し訳ありません。 文字列:<textarea name="sss1" cols="100" rows="12" onClick="FormName(this)">abcde</textarea><textarea name="sss2" cols="100" rows="12"></textarea> から、 abcde を抽出したく、 下記のようにコーディングしましたが、 abcde</textarea><textarea name="sss2" cols="100" rows="12"> になってしまいます。 正規表記のコーディングを教えてください。 よろしくお願いします。 <?php $a = "<textarea name=\"sss1\" cols=\"100\" rows=\"12\" onClick=\"FormName(this)\">abcde</textarea><textarea name=\"sss2\" cols=\"100\" rows=\"12\"></textarea>"; mb_ereg("<textarea name=\"sss1\" cols=\"100\" rows=\"12\" onClick=\"FormName(this)\">(.*)</textarea>",$a,$b); print "$b[1]"; ?>

    • ベストアンサー
    • PHP
  • javascriptを教えて下さい

    上の欄に文字を入力しボタンを押すと下の欄に表示するhtmlを作りたいと思っております 何回か自力でやってみたのですがわからないのでどのようにするかご教授願いたいです・・・ ソースは <form method="POST" action="検索"> <textarea name="msg" cols="30" rows="10"> ここにメッセージをどうぞ </textarea> <br> <input type=submit value="送信"> <br> <input type=reset value="クリア"> </form> <form method="POST" action="受信"> <textarea name="msg" cols="30" rows="10"> </textarea> </form> このようなふうになってます このままじゃダメでjavascriptを使うということはわかっているのですがどのようにしたらいいかわかりません・・・ 何回か試したのですがうまくいきませんでした 初心者なのでアドバイスお願いします!

  • テキストエリア内にPHPのソースコードを書く

    <form action="" method="post"> <textarea name="img" cols=40 rows=4 readonly> <?php echo"<?php echo"masao"; ?>"; ?> </textarea></form> このプログラムの結果 <?php echo"masao"; ?> と表示したかったのですが案の定できませんでした。 どのようにしたら表示させることができるでしょうか?

    • ベストアンサー
    • PHP
  • PHPでJavascriptの引数の扱い方

    はじめまして。宜しくお願い致します。 環境:Linux(Redhat 9), apache2, PHP4.3.6 [やりたいこと] 下記↓ソース内容↓より、input=button と input=text が幾つかある。 個々のボタンが押されたら、PHPにて"個々"の内部処理を行う。 内部処理終了後は、個々のテキストにインクリメントした値が画面表示される。 HTML+Javascript にて、カウンター部分は一応完成しています。 ↓ソース内容↓ <html> <head> <script language="JavaScript"> <!-- function ccc(obj0) { cnt = obj0.value; cnt++; obj0.value = cnt; } // --> </script> </head> <body> <form name="ose"> <input type="text" name="view0" readonly size=5 maxlength=3> <input type="button" value="押せ0" onClick="ccc(view0)"><br> <input type="text" name="view1" readonly size=5 maxlength=3> <input type="button" value="押せ1" onClick="ccc(view1)"> </form> </body> </html> コレをPHPに書き換えると、上手くいきません。 ↓PHPに書き換えた場合↓ <script type="text/javascript"> <!-- function ccc($obj0) { cnt = $obj0.value; cnt++; $obj0.value = cnt; } // --> </script> 引数に付いている "$"マークをJavascript側で認識しないのだろう、と考えています。 出来れば、PHPで単体の関数として使用したい為、模索中です。 ※現在は、別の関数の中に上記の『↓HTML+Javascriptの場合↓』を無理矢理入れて使用しています。(別の関数:HTMLをPHPファイルに書き込む) 別の関数内に入れてても問題は無しです。 但、上記のJavascriptを使用しないソース達にも書き込んでしまうので、ちょとやだなーと。 いい方法があったら教えて下さい。

    • ベストアンサー
    • PHP
  • テキストエリアをenterキーでフォーカス移動したい

    複数あるテキストエリア間を、enterキーでフォーカス移動をしたいです。 以下のようにしましたが、2つめのテキストエリアへフォーカス移動すると、改行が入力され、カーソルが2行目へ移動してしまいます。 enterキーを押しているのでこうなってしまうと思うのですが、 カーソルが1行目へ移動するようにするには、どうしたらいいでしょうか? フォーカス移動後に改行コードがあったら、""にreplaceする・・等、試してみたのですが、なかなか上手くいきません。 どなたかお分かりになる方がいらっしゃったら、教えてください。 <HTML> <HEAD> <SCRIPT language="JavaScript"> <!-- function FirstFocus() { document.forms.F1.elements[0].focus(); } function nextFocus(n) { if (event.keyCode == 13) { for (var i = 0, f = n.form.elements; i < f.length; i++) { if (f[i] == n) { (f[i + 1] || f[0]).focus(); } } } } //--> </SCRIPT> </HEAD> <BODY onload="FirstFocus()"> <FORM name="F1"> <TEXTAREA name="T1" rows="5" cols="30" onkeydown="nextFocus(this);"></TEXTAREA><BR> <TEXTAREA name="T2" rows="5" cols="30" onkeydown="nextFocus(this);"></TEXTAREA><BR> <TEXTAREA name="T3" rows="5" cols="30"></TEXTAREA><BR> </FORM> </BODY> </HTML>

  • ajaxを使用してckeditorを表示したい

    PHPとjquery1.3 で ajax を使用し、下記のような処理を書いてみました。 text.phpにckeditorを表示させたいのですが、どのようにすればいいのでしょうか? ソースコードで教えて頂けると助かります! ちなみに呼び出しもとのファイルでの ckeditor の動作は確認できました。 よろしくお願いします。 ■呼び出し元のhtml <html> <head> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript" src="ckeditor/ckeditor.js"></script> <script type="text/javascript"> $( function() { $("select").change(function () { var value = ""; $("select option:selected").each(function () { value += $(this).val(); }); $("#out").load("text.php?name=" + value); }).change(); }); </script> <title>テスト</title> </head> <body> <select name="text"> <option value="normal">テキスト入力</option> <option value="html">htmlエディター</option> </select> <div id="out"></div> </body> </html> ■text.phpの内容 <? if(isset($_GET['name'])){ $name = $_GET['name'];} if($name == "normal"){ ?><textarea cols="80" rows="10">テキスト入力</textarea><? }elseif($name == "html"){ ?><textarea class="ckeditor" id="editor" cols="80" rows="10">htmlエディター</textarea><? } ?>

  • 改行するには? FORMで入力されたデータ

    下記のFORMで入力 <TEXTAREA rows="20" cols="53" name="name3"></TEXTAREA> で$nameに入力した複数行を php <?php print "メッセージ→"; print $name3; ?> で、$nameを改行しながら 表示したいのですが?

    • ベストアンサー
    • PHP
  • PHPについて質問です。

    PHPについて質問です。 <?php $lines0 = file('data.txt'); $lines = array_reverse($lines0); foreach ($lines as $line_num => $line) { echo "Line #<b>{$line_num}</b> : " . htmlspecialchars($line) . "<br />\n"; } ?> でファイルの内容は表示することができるようになったのですが、 次に、$linesをテキストエリアに表示させようとすると、Arrayと表示されます。 <textarea name="textarea" cols="50" rows="5" disabled="disabled">$lines</textarea> どうすれば解決できるでしょうか?

    • ベストアンサー
    • PHP
  • <textarea>の最後尾に追加した実体参照や数値参照が意図した通り表示されない

    <textarea>の最後尾に追加した実体参照や数値参照が意図した通り表示されません。 確認したこと(■1■)と、やりたい事(■2■)は、下記の通りです。 ■1■ <textarea>~</textarea>の中に直接記述すると    下記の例だと、 <とか> と、表示されます。 <textarea name="output" id="outputEdit" style="background-color:#99ff66" cols=80 rows=25> &lt;とか&gt </textarea> ■2■ javascriptで<textarea>の最後尾に追加する方法だと、    下記の例だと、 &lt;&gt; と、表示されてしまいます。 <textarea name="output" id="outputEdit" style="background-color:#99ff66" cols=80 rows=25></textarea> <script language="javascript"> <!-- var objTextarea = document.getElementById('outputEdit'); objTextarea.value+="&lt;&gt;"; //--> </script> 2の記述で、1と同じ様に表示させたいのですが、 無理なのでしょうか? どうか宜しくお願いいたします。

  • jqueryでtextareaのcols、rowsの属性を設定する

    javascriptでDOMでtextareaを多数発生させているのですが、その発生したtextareaのcols属性とrows属性をjqueryを用いて設定したいです。 どのようにしたらいいのかわかりません。 教えて下さい。