• ベストアンサー

テキストエリアの文字を切り替える

意味が通じにくいかもしれませんが、1つのボタンを押すことでフォーム内テキストエリアの中身をどんどん切り替えていくって言うのはどうすればいいでしょうか? ┌―――――― |[内容] | └――――――  【ボタン】 例えばまず最初にボタンを押したら[内容]が[文章A]に、またボタンを押したら[文章B]、さらにボタンを押したら・・・といった具合に1回ボタンを押すごとにテキストエリアの中身をどんどん切り替えて行きたいのですが・・・。 私の力では検索などを使用してもやり方を見つけることが出来ません。どうかよろしくお願い致します。

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

  • ベストアンサー
noname#20964
noname#20964
回答No.3

ANo2のスクリプトはtextareaに、隠してあるpの内容(display:none)を映してしるだけなのですが、textareaは#PCDATAしか出現できないため<BR>などのタグがpの中に含まれるとエラーがでるのではないかと思います。 そこでタグも映すときには、いろいろなタグが出現できるdiv((%flow)*)などを使った方が無難だと思います。 (あくまでも訪問者に対してテキストエリアに入力を促さない場合です。) そこで解決策として下のようにすると良いかもしれません。 -----------追加----------------------------- これはdivをテキストエリア風にするスタイルです。 <style type="text/css"> #area{width:200px;height:100px;overflow:scroll;border:inset 2px;} </style> -----------変更----------------------------- テキストエリアをdivに変更します。 document.write('<textarea id="area">文章A</textarea>') ↓ document.write('<div id="area">文章A</div>') ----------------------------------------------------- このようにするとpの中にタグが含まれていてもエラーがでることはないと思います。

MAN_MA_RUI
質問者

お礼

これはいろいろ応用が利きそうですね。目的にかなっているし、大変勉強にもなります。 ご回答くださいましてどうもありがとうございました。

その他の回答 (2)

noname#20964
noname#20964
回答No.2

ANo.1の回答をこのように改造すると順番に表示されます。 --------------------------------------------------- <head> <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=SHIFT_JIS"> <title>**</title> </head> <body> <div id="data"> <p>文章A</p> <p>文章B</p> <p>文章C</p> <span style="display:none">0</span> </div> <script type="text/javascript"> <!-- document.write('<textarea id="area">文章A</textarea>') document.write('<button onclick="a()">Next>></button>') var DATA = document.getElementById('data') DATA.style.display="none" function a(){ var Count = DATA.getElementsByTagName('span') var TEXT = DATA.getElementsByTagName('p') var AREA = document.getElementById('area') TextNo = eval(Count[0].innerHTML)+1 if(TextNo == TEXT.length){TextNo = 0} Count[0].innerHTML = TextNo AREA.innerHTML = TEXT[TextNo].innerHTML } //--> </script> </body> </html>

MAN_MA_RUI
質問者

お礼

スクリプトはちゃんと望みどおりに動作しました。 dshguskdigさん、ご教授くださいましてありがとうございます。 ・・・ちなみに、このスクリプトでボタンを押したときに表示される文章を改行することはできるのでしょうか? 一応自分でもいじってはみたのですが、よくわかりません。 別に改行されなければ困るというわけでもありませんが、もし宜しければ・・・。

  • talepanda
  • ベストアンサー率58% (45/77)
回答No.1

<textarea id="orz"></textarea> <button onclick="document.getElementById('orz').innerHTML+='orz ';">@</button> を応用してください

MAN_MA_RUI
質問者

お礼

ご回答ありがとうございます。 ご提示いただいたソースは参考にはなりそうですが、残念ながら当方の意図するものとは違います。 説明が悪かったのかもしれません。私はボタンを押すごとにそれまであった内容を消して、別の内容を表示させて行きたいのです。 何か心当たりなどはないでしょうか・・・?

関連するQ&A

  • テキストエリアにあわせた文字サイズ変更

    Javascript自体うまく動かすことができず、 サンプルを探しても見つからず、困っております。 やりたいことは、 Aのテキストエリアに入力した文字を「OK」ボタンクリックと同時に Bという別のテキストエリア(エリアの枠は固定)にリサイズ表示させたいと思います。 テキストエリア自体を文字数により大きくするサンプルはありましたが その逆のテキストエリアのサイズに文字をあわせるものが見つかりません。 申し訳ありませんが、おしえていただけますでしょうか。

  • テキストエリアの内容がメールに送信できない

    テキストボックスやラジオボタンなど、フォームに書き入れた内容をメールに送信するプログラムを作っています。(アンケートフォームのようなもの) まず、nyuryoku.phpでテキストエリア内に入力されたものを kakunin.php に $area1 として、表示させました。その内容を、hidden でmail.php に送りました。 kakunin.phpでは、$area1 がきちんと表示されるのに、 メールに送られてきた内容は、1行しか送られてきません。 なぜなのでしょうか? kakunin.phpで改行させる為に、  $area2 = nl2br($_POST[area]."\n"); をしましたが、それは関係あるのでしょうか。 分かりづらい説明で、申し訳ありませんがよろしくおねがいします。

    • ベストアンサー
    • PHP
  • テキストエリアの文字数を数えたい

    Java初学者です。簡単な本をやり終えたので、ちょっと自分の役に立つ ものを作ってみようということになりました。 そこでレポート作成の際に使えそうな、 文字数、行数をカウントできるアプリケーションを作ることにしました。 具体的には、フレームは縦に2分割され、左側にボタン、右側がテキストエリアとなっています。 ボタンとは[文字数を数える][行数を数える][貼り付け]などのボタンです。 ボタンの下にその結果を表示するラベルも用意します。 貼り付けなどは既に用意されているpasteメソッドなどを使えば済む話ですが 肝心の文字数をカウントするのをどう実現するかで悩んでいます。 そもそも、テキストエリア内にある文字列?を直接扱う術が分かりません。 このままでは既に用意されている関数以外の操作は出来ないことになってしまいます。 テキストエリアないの文章をString型の変数に入れる、とかは出来ないんでしょうか。 幼稚な質問かもしれませんが、よろしくお願いいたします。

    • ベストアンサー
    • Java
  • HTMLの内容をテキストエリアに表示する

    いつもお世話になっています。タイトル通りなのですが a.htmlというファイルにたとえば 「あいうえお」 という日本語が記述されているとします(ブラウザで表示するとあいうえおが表示される) そして何かボタンをクリックするとb.htmlのサブウィンドウが表示され そのページにあるテキストエリアに「あいうえお」が表示され テキストエリア内の文字列を編集しボタンをクリックすると a.htmlの内容が一時的でも更新されるようにしたいと思っています。 このような動作をjavascriptのみで行うことは可能でしょうか? 感覚的には掲示板で書き込んだ内容を修正するときのようなものです。 jspで似たような動作をするものを作成しましたが サーバーを介さずにそのような動作をさせたいと思っていますが 不可能でしょうか? b.htmlで編集した内容がa.htmlに保存されなくてもかまいません。 そのときだけでも変化していればいいのです。 言葉が足らずわかりにくいと思うのですが 何卒よろしくお願いします。

  • テキストエリアにカーソルを自動的に移動させる方法

    ASPで、 テキストエリア(フォーム)    ↓ テキストエリアの入力をファイルに書き込み    ↓ ファイルの内容を一覧表示 の順に処理を並べて組んでいます。 テキストエリアに文字を入力したあと、送信ボタンを押すと、 ファイルに書き込んで、ファイルの内容を画面に表示します。 カーソルが、画面の下にいってしまいます。 一度テキストエリアの外に行ってしまったカーソルを、自動的に テキストエリア内に戻す方法を教えてください。

  • ボタンを押してテキストに文字をセットする

    教えてください。 画面イメージが Aテキスト ボタン Bテキストのように配置しています。 そこでAテキストにコードを入力後にボタンを押してBテキストに名称をセットするようにしたいのですが。 検索する文字列はhiddenでセットしています。 30112900,A商店,45890736,B商店,78653672,C商店・・・ このような文字列を使用し、「30112900,A商店」が1レコードのイメージです。 Aテキストに「45890736」を入力してボタンを押すと文字列から検索してBテキストに「B商店」を表示されるようにしたいのです。 質問の内容も分かり難いかと思いますが、どうぞ宜しくお願い致します。

  • テキストエリアからボタンによって送り先を変えるには?

    こんにちは。 ひとつのテキストエリアから、ボタンの違いによって送り先を変更することは可能なのでしょうか? 具体的にやりたいことは、「検索デスク」と言うサイトのように、入力フォームは同一でもボタンの違いによって送り先が変わっています。 やりたいことは「検索デスク」さんと同一なのですが、ソースを拝見しても良くわかりませんでした。 大手のサーチエンジンの検索窓を羅列することはできるのですが、もう少しスマートにしたいです。(^^ゞ わたしのスキルは質問ID195803のとおり、JavaScriptを良く理解していないようです。 よろしくおねがいします。<(__)>

  • フォームで入力した値を別のフォームにコピーする

    はじめまして! javascriptでフォームAに入力した内容を ボタンが押されたら同一ページのフォームBに ペーストされるscriptを作りたいのですが そういったスクリプトを公開しているものがあれば 教えていただきたいです。よろしくお願いいたします。 やりたい事: [フォームA]---------------------  お名前:テキスト  性別:ラジオボタン  趣味:セレクトボックス  コメント:テキストエリア  [コピーボタン]←内容をコピーするボタン -------------------------------- ↓コピーボタンが押されたら↓ [フォームB]---------------------  お名前:テキスト  性別:ラジオボタン  趣味:セレクトボックス  コメント:テキストエリア -------------------------------- Aフォームに入力した内容Bフォームに反映される よろしくお願いいたします。

  • テキストエリアの内容を印刷できるようにしたい

    宜しくお願いします。 JAVAスクリプトで作った見積もりのページがあります。 該当部分の個数を選択して、下に総計を表示させるのですが 『選択内容を表示』というボタンを押すと 更にその下にあるテキストエリアに選択した内容と総計が 表示されるようにしています。 そこで、質問なのですが、 そのテキストエリアの下に『上記内容を印刷』という ボタンをつけて、テキストエリア内の部分だけを 印刷できるようにしたいのですが、可能でしょうか? お分かりになる方がいましたら、教えてください。

    • ベストアンサー
    • HTML
  • フォームのテキストエリアをクリックしただけでコピー

    フォームのテキストエリアをクリックしただけで、 中にあるすべてのテキストの内容を クリップボードへ送ることはできますか?

    • ベストアンサー
    • HTML

専門家に質問してみよう