JavaScriptのテキストエリアに順番に数値を表示する方法

このQ&Aのポイント
  • JavaScriptでテキストエリアに順番に数値を表示する方法について教えてください。
  • C言語ではforループを使用して数値を表示することができましたが、JavaScriptではどのように実現できるのか知りたいです。
  • また、JavaScriptでの出力は一度に表示されるため、テキストエリアに追加で表示する方法を教えていただけると助かります。
回答を見る
  • ベストアンサー

JavaScriptの勉強をしているのですが、行き詰まっているので知恵

JavaScriptの勉強をしているのですが、行き詰まっているので知恵をお貸し下さい。 <TEXTAREA NAME="out" ROWS=30 COLS=30></TEXTAREA> で作成したテキストエリアに、数字を順に表示させたいと思っています 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10,11,....... 20,... この様な出力をしたいのです。 C言語ですと for(i=0;i=<30;i++){ printf("%d,",i) count++; if(count%=10)printf("\n") } この様な感じで出力できると思うのですが、 JavaScriptでの出力はdocument.form.out.value = iしか知りません。 コレですと、最後の1つしか表示されない(順に表示されているのだと思いますが早すぎて見えてない)状態です。 テキストエリアに、新規で出力するのではなく、追加で出力する方法はありませんか? よろしくお願いします。

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

  • ベストアンサー
  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.2

こんなことでしょうか? (おまけで、順番に表示するものも追加) <html> <head> <script type="text/javascript"> function test1() { var e = document.forms[0].out; e.value = ''; for (i=0; i<=30; i++) e.value += (i?',':'') + i; } function test2(s) { if (s == 'start') { this.count = 0; clearTimeout(this.tm); } document.forms[0].out.value = this.count++; if (this.count<=30) this.tm = setTimeout(test2,500); } </script> </head> <body> <form> <textarea name="out" rows=30 cols=30></textarea> <p> <button type="button" onclick="test1()">まとめて表示</button> <button type="button" onclick="test2('start')">順番に表示</button> </form> </body> </html>

その他の回答 (2)

回答No.3

たいこうして。(って、だれに?) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <title>TEST</title> <body> <form name="abc" action="#">  <p><textarea cols="40" rows="4" name="" id="xyz"></textarea></p>  <p><textarea cols="40" rows="4" name="" id="uvw"></textarea></p> </form> <script type="text/javascript"><!-- var Counter = function ( n ) {  var cnt = n || 0;  return function () {   return cnt++;  }; }; var Checker = function ( max ) {  return function ( n ) {   return max < n;  } }; var Display = function ( e, f, c ) {  return function ( ) {   var tmp = c.call();   e.value += tmp +',';   return f(tmp);  }; }; var Timer = function ( func, interval ) {  return function ( ) {   var f = func.apply( this, arguments );   f || setTimeout( arguments.callee, interval );  }; }; Timer(Display( document.forms['abc'].elements['xyz'], Checker(20), Counter( 0 ) ), 100)(); Timer(Display( document.forms['abc'].elements['uvw'], Checker(120), Counter( 100 ) ), 200)(); </script> </body> </html>

  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.1

方法はいっぱいありますけど、 基本的にC言語と同じようなロジックで考えられます。 document.form.out.valueを使いたかったら for(i=0;i=<30;i++){  document.form.out.value += i; } ですよ。

関連するQ&A

  • javascriptでCGIに値を渡したいのですが、テキストエリアの値で改行コードが消えてしまいます。教えて下さい。

    javascriptでCGIに値を渡したいのですが、テキストエリアの値で改行コードが消えてしまいます。教えて下さい。 別窓ページにてtest.cgiを呼び出し、そのCGIに値を渡したいのですが、 一応値はテキスト形式で渡せるのですが、テキストエリアで入力したものの 改行コードが消えてしまいます。何か良い方法があれば、教えて下さい。 <FORM name="test" ACTION="javascript:test_window_open('/cgi-bin/test.cgi?bikou='+document.test.bikou.value);"> : : <TEXTAREA rows="8" cols="50" name="bikou"></TEXTAREA>

  • [javascript][IE] textarea内の改行を消す方法を教えてください。

    テキストエリア内の改行をreplaceで除去したいのですが、FireFoxではうまくいくのですがIEではうまく動作しません。 下記のようなソースです。 IEではどのように書けば良いのでしょうか。 <html> <head> <script type="text/javascript" language="javascript"> function change_box(){ temp = document.getElementById("in").value; temp = temp.replace(/\n/g,""); document.getElementById("out").value = temp; } </script> </head> <body> <form> <textarea id="in" rows="3" > 一行目 二行目 三行目 </textarea><br /> <textarea id="out" rows="3" ></textarea><br /> <input type="button" value="変換" onclick="change_box()"> </form> </body> </html>

  • 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を使うということはわかっているのですがどのようにしたらいいかわかりません・・・ 何回か試したのですがうまくいきませんでした 初心者なのでアドバイスお願いします!

  • Javascriptで複数のフォームを連結したい

    初めまして、 お世話になります。 Javascriptで複数のフォームを連結したいと考えています。 やっと2つのテキストエリアを連結させるところまで出来るようになりました。 やりたいことは、出力させるときに下記のようにしたいのですが、 どのようにすれば良いかご教授いただけば幸いです。 テキストエリア:text01とtext02を連結させて出力させる時に、 text01とtext02の間に”改行コード”を追加したいのです。 それとラジオボタンで選択をした値を取得するための、 スクリプの記述方法もご教授頂けないでしょうか? また、可能であればテキストエリア:outputに出力するときうに、 下記のように出来ると希望通りの操作が出来助かります。 HTMLを勉強し始めたばかりの初心者ですが、 どうぞ何卒よろしくお願い申し上げます。 出力結果: ----------------------------------------------------------------------- 【入力欄1】改行コード text01 改行コード 【入力欄2】改行コード text02 改行コード 【ラジオボタン】 A01 改行コード ソース: ----------------------------------------------------------------------- <html> <head> <script language="JavaScript"> <!-- function textoutput() { var text01 = (document. form01. text01.value); var text02 = (document. form01. text02.value); document. form01. output.value = text01 + text02; } //--> </script> </head> <body> <form name="form01"> <!--入力欄1// --> 入力欄1<br> <textarea name="text01" cols="60" rows="10"></textarea><br> <!--入力欄2// --> 入力欄2<br> <textarea name="text02" cols="60" rows="10"></textarea><br> <!--ラジオボタン// --> <strong>・ OS確認</strong><br /> <input type="radio" name="A01" value="・OS ⇒ XP" id="radio1-1" > <label for="radio1-1">XP</label> <input type="radio" name="A01" value="・OS ⇒ Vista" id="radio1-2"> <label for="radio1-2">Vista</label> <input type="radio" name="A01" value="・OS ⇒ Win7" id="radio1-3"> <label for="radio1-3">Win7</label> <input type="radio" name="A01" value="・OS ⇒ Mac" id="radio1-4"> <label for="radio1-4">Mac</label> <input type="radio" name="A01" value="・OS ⇒ " id="radio1-5"> <label for="radio1-5">その他</label> <br /> <!--ログ出力// --> ログ出力<br> <input type="button" value="ログ出力" onClick="textoutput();"><br> <textarea name="output" cols="60" rows="10"></textarea><br> </form> </body> </html>

  • テキストエリアを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>

  • JavaScriptでこんな事って出来ますか?

    JavaScript超初心者です。最近本を買って、ネットで調べながら勉強中なのですが、とても難しいです。 現在この様な事が出来ないかと色々調べているのですが、JavaScriptで、出来ますでしょうか?可能であれば、勉強もかねて作ってみようと思うのですが? 何も意味の無いスクリプトですが、一行テキスト3つに 入力したものを、各場所に配置して出力させる!と言うものです。まだ何も出来ていませんが、ソースを見ていただければと思います。 ソースです。 <FORM>ここにURL<BR> <INPUT size="50" type="text"><BR> ここにalt<BR> <INPUT size="50" type="text"><BR> ここに表示文章<BR> <INPUT size="50" type="text"><BR> <INPUT type="button" name="button" value="出力"><BR> ここに出力<BR> <TEXTAREA rows="5" cols="50"></TEXTAREA></FORM> といった感じです。出力結果として、 <a href= "1行目のURL" alt="2行目のalt">3行目の表示文章</a> のような感じで、最後のテキストボックスに表示させたいと思います。この様なことは、JavaScriptで可能でしょうか?可能な場合、どの辺を勉強すればいいでしょうか?変な質問ですが、よろしくお願いいたします。

  • テキストエリアについての質問です。

    携帯サイトでテキストエリアを使っています。 <a href=゛゛></a>のタグをテキストエリア内に書いたところ、パソコンだと普通に表示されるのですが、携帯だと゛゛の間に変な英語と数字が沢山表示されます。 携帯でも普通に表示するには、どうすればいいのか分かりません。 教えてください。 よろしくお願いします。 テキストエリアはこのように書いています。 <form action゛.゛><textarea cols=゛8゛ rows=゛1゛> <a href=゛゛></a> </textarea></form>

    • ベストアンサー
    • HTML
  • テキストエリアの作成法

     下記のような横一列に並んだ3つのテキストエリアを作成しました。Mozilla Firefoxではほぼ期待通り表示されましたが、インターネット・エクスプローラーでは全く表示されません。後者でも表示させるにはどうしたらよいでしょうか。 またテキストエリア内の文章に改行をつけるにはどうしたらよいでしょうか。 <form><p class=MsoNormal><span><TEXTAREA ROWS="13" COLS="70" NAME="textarea1"id=textarea1 style="HEIGHT: 540px; WIDTH: 300px; font-size: 9pt" readonly> 『テキスト』 </TEXTAREA> &nbsp;<TEXTAREA ROWS="13" COLS="70" NAME="textarea1"id=textarea1 style="HEIGHT: 540px; WIDTH: 300px; font-size: 9pt" readonly> 『テキスト』 </TEXTAREA> &nbsp;<TEXTAREA ROWS="13" COLS="70" NAME="textarea1"id=textarea1 style="HEIGHT: 540px; WIDTH: 300px; font-size: 9pt" readonly> 『テキスト』 </TEXTAREA></span></p></form>

  • ローカルファイルの表示

    ローカルのテキストを読込み、下記のようなテキストエリア内へ表示する事は可能でしょうか? java scriptでやってみたのですが、ローカルでしか無理なようでした。 CGIではどうか教えて頂けませんか? 初心者で申し訳ありませんが、宜しくお願い致します。 <form name="form1"> <input type=file name="file"> <textarea rows="30" cols="30" name="text1"> (ここへローカルのテキストファイルを表示したい。) </textarea>

    • ベストアンサー
    • CGI
  • テキストエリア内で改行するには。

    次のスクリプトを実行すると、テキストエリア内に 01234560 と数字が表示されますが、これを 0 1 2 . というように改行も含めてテキストエリアに出力するにはどうすればよいでしょうか。 ¥nという文字を使用するのでしょうか? <html> <head> <script language="JavaScript"> <!-- var textA="" function my1() {for (i=0;i<11;i++){textA=textA+new String(i)} document.form1.text1.value=textA;} //--> </script> </head> <body> <form name="form1"> <textarea name="text1" size="10"></textarea> <input type="button" value="CLICK!" onClick="my1();"> </form> </body> </html>

専門家に質問してみよう