- ベストアンサー
JavaScriptで普通の文字を変更したい
えっと。INPUTタグでならValueの値をJavaScriptで変更ですまが 普通のFONT？などの文字を例えばボタン押下時などに変更をした いのですが、方法がわからずに困っています。 どこかのサイトで見かけたことがあるので出来るとは思うのですが どなたかご存知の方がいらしたら教えて下さい。 どうか宜しくお願いします。
- nsakurako
- お礼率50% (183/364)
- JavaScript
- 回答数2
- ありがとう数4
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
DOMに対応しているブラウザであれば、下記のソースで実現できると思います。 <html> <head> <title></title> <script type="text/javascript"><!-- function changeTxt(txt){ if (document.getElementById){ document.getElementById("chtxt").innerHTML=txt; } } //--></script> </head> <body> <p><span id="chtxt">こんにちは。</span>ようこそ。</p> <form> <input type="button" value="今は朝ですが" onClick="changeTxt('おはようございます。')"><br> <input type="button" value="こんにちは" onClick="changeTxt('こんにちは～。')"><br> <input type="button" value="もう夜ですよ" onClick="changeTxt('こんばんは。')"> </form> </body> </html> 上のスクリプトでは、 document.getElementById("特定の要素のID名").innerHTML="書き換えるHTMLソースの内容" という形で特定の要素内のHTMLソースの書き換えを行っています。 これはDOMとinnerHTMLプロパティを利用したもので、IE5以降、Netscape6以降で動作すると思います。 なお、getElementByIdの部分は、大文字と小文字の部分をすべて正確にこの通りにしておかないと、動作しなくなる可能性がありますので、注意してください。 この例では、span要素にchtxtというID名をつけて、その中のHTMLを書き換えていますが、他の要素に対して同じようにID名をつけて、DOMを利用してそのIDで要素を特定し、その内容を書き換えることも可能です。 いろいろと試してみると良いと思います。 上記では、IE4やNetscape4.xxでは動作しませんが、似たような方法で実現することも可能と思います。 DHTMLについて調べてみると、やり方も見つけられると思いますよ。 と、そちらについては先の方の回答にもありますね。 参考になれば。
その他の回答 (1)
- mousengoke
- ベストアンサー率50% (197/388)
一応NN4でも動作するようにサンプルを作りました。 ただし、NN4での動作は厳しくスタイルシートでposition:absolute;を宣言する必要があります。また、NN4.xではidのスタイルを指定する際#kakikaeのように要素名を省略した形でないと適用されないようです。なお都合によりモジラ系ブラウザーでの動作確認はしていません。 <html> <head> <style type="text/css"> <!-- #kakikae{ position:absolute; } --> </style> <script type="text/javascript"> <!-- function changechar(){ var newchar = "<strong>あー<\/strong>"; if(document.all){ //IEで動作 kakikae.innerHTML = newchar; } else if(document.getElementByID){ //モジラ系ブラウザー(N6以上等)で動作 document.getElementByID("kakikae").innerHTML = newchar; } else if(document.layers){ //NN4.xで動作 document.kakikae.document.open(); document.kakikae.document.write(newchar); document.kakikae.document.close(); } } //--> </script> </head> <body> <form> <input type="button" value="クリック" onClick="changechar()"> </form> <div id="kakikae"> </div> </body> </html>
お礼
早速の回答をありがとうございました。 こんなに複雑とは！！ 教えて頂かなければ、いつまでも到達することは出来ませんでした。 本当にありがとうございました。
関連するQ&A
- javascriptで、表示されている文字を変更する。
javascriptで、表示されている文字を変更する。 初歩的な質問になると思いますが、ご教授ください。 javascriptで、例えば、 フォーム内の特定のテキストボックスに、ある値を代入する場合は、 frm1.text1.valur="あああ"; // フォームの名前.テキストボックスの名前.value また、特定の文字<font id="moji1">あああ</font>を表示／非表示する場合は、 document.getElementById('moji1').style.visibility='visible'; // 又は、'hidden' と言った感じで、javascriptで、 特定の文字を変更したいのですが、行き詰っております。 例えば、 <font>あああ</font> を <font>いいい</font> に変更。 どなたかご存知の方、ご教授ねがいます。 よろしくお願いします。
- ベストアンサー
- JavaScript
- Javascriptを用いて文字サイズを変更可能にするには
ブラウザの『文字のサイズ』からではなく、Javascriptを用いてフォントサイズを変更させたいのですが、うまくいきません。 HTML紹介サイトにて、類似のものを見付けたのですが、こちらはボタンを使っています。文字リンク（<a href="javascript:fontsize1()">文字を大きく</a>のように）でフォントサイズを変えることは出来ないのでしょうか。 http://l-c.moo.jp/mozi40.htm ご存知の方がおられましたら、どうかご回答下さい。
- ベストアンサー
- JavaScript
- HTML?JavaScript? INPUTタグ内の文字をハイライト
HTML?JavaScript? INPUTタグ内の文字をハイライトさせたい 下記画像のように、formタグ中にある、Inputタグ内の文字をそれぞれカラフルにハイライトさせたいのですが、その方法が分かりません。HTMLかJavaScriptを使えばできるのかも分かりません。 どのようにすれば良いかどなたか教えていただけないでしょうか？宜しくお願い致します。 なお、下記のようにやってはみたものの、submitでタグも送信してしまいますし、タグがそのまま表示されてしまい、イメージする様にはなりませんでした。 <form action="～"> <input value="<span style=background-color:#ffff00>Input</span> <span style=background-color:blue>文字</span> <span style=background-color: pink>ハイライト</span>"> <input type=submit> </form>
- ベストアンサー
- JavaScript
- ボタンを押すと、テキストエリアに文字が出て、さらにそれを
アレンジしたいのです。 <FORM> <INPUT type="text" value="テスト" name="b1" size="55"> <br> <font style="font-size:15px" color="#666666">ボタンをクリック！</font> <INPUT type="button" value="ボタン" onclick="b1.value='こうゆうふうに字が出る'"> </FORM> 上記のようにして「ボタン押す=文字出る」を作りました。 さらには、１文字づつもったいぶって、文字を出したいのです。 別の、タグで「勝手に１文字づつ出る」のは、あったと思いますが、ボタンで、動作開始をしたいと思います。 何か、よいアイデアはありますでしょうか？
- 締切済み
- HTML
- javascriptによる動的なリンクの変更
javascriptによって、ラジオボタンをチェックする度に(チェックを変える度に) 動的にリンクを変更したいのですが、上手くいきません。 すみませんが、どなたか教えていただけないでしょうか？ ちなみに、下記は私が試したコードです。(全く動きませんが。) ラジオボタンのチェックを変えると、<a>タグのhrefの中身のURLが、そのボタンのvalueに対応して変わるようにしたいのですが。。 <FORM NAME="sample"> 選択して下さい --> <input type="radio" name="list" OnChange="UpdateLink()" value="http://www.yahoo.co.jp" />s <input type="radio" name="list" OnChange="UpdateLink()" value="http://www.vector.co.jp/authors/VA011407/" />m <input type="radio" name="list" OnChange="UpdateLink()" value="mailto:akirayu@a2.mbn.or.jp" />l <A href="samplelink">リンク更新!!</A> </FORM> <SCRIPT LANGUAGE="JavaScript"> <!-- var pos; for(var i=0; i < document.links.length; i++) { if (document.links[i].href.indexOf("samplelink") != -1) pos = i; } function UpdateLink() { checked = document.sample.list.checked Index; document.links[pos].href = document.sample.list[checked ].value; } //--> </SCRIPT>
- ベストアンサー
- JavaScript
- javascriptまかせでフレーム中の特定文字色変更
HTMLに組み込んだjavascriptの引数部分だけを変える方法で、 フレーム中の特定の文字だけの色替えがしたいです。 （自分でＨＴＭＬを編集して文字列を複数のタグに分解して 色の変更をするのではありません） マウスをのせて変更のような動的に変更するのではなく、 画面を開いた段階で色がかわっていればよいです。 ご存知の方いらっしゃいますか？
- 締切済み
- JavaScript
- Javascriptで文字の足し算？
1というテキストボックスにblueという文字が入っていたとします。 その文字を引っ張って、2というテキストボックスに <font color=blue> と入れたいのです。 javascriptで document.フォーム名.テキストボックス2.value = '<FONT COLOR=>'; とすれば、「<FONT COLOR=>」とテキストボックス2に入りました。 document.フォーム名.テキストボックス2.value = '<FONT COLOR=' + document.フォーム名.テキストボックス1.value + '>'; とすると、 「<FONT COLOR=[object]>」となってしまいます。 どのようにしたらきちんと入るでしょうか？
- ベストアンサー
- JavaScript
- formタグのvalue="" に代入される文字列をsubmitボタン
formタグのvalue="" に代入される文字列をsubmitボタンが押されたときに Javascriptでlocation.hrefで現在のURLを判定して 条件分岐してformタグのvalue="" に "A" や "B" といった 文字列を代入したいと考えてます。 現在下記のタグを書いているのですが、submitボタンが押されたときに パラメータにvalueの値が代入されず、困ってます。。。 タグの記述に間違いがあると思うのですが、ご指摘いただけないでしょうか？ ■現在のタグ １．Javascript側 <script> <!-- function check() { if(location.href.startsWith('http://www.AAA.com/AAA/')){ document.exp.categoryII.value = "A"; }else if(location.href.startsWith('http://www.AAA.com/BBB/')){ document.exp.categoryII.value = "B"; } return true; } // --> </script> ２．formタグ側 <form onsubmit="return check()" name="exp" action=""> <input name="gen" value="6" type="hidden" /> <input name="categoryII" value="" type="hidden" /> <input name="button" value="検索" type="submit" /> </form> よろしくお願い致します。
- ベストアンサー
- JavaScript
- 値をフォームに反映させるには…
JavaScriptで得た値をフォームに反映させたいと思っています。 テキストボックス(InputタグのType='text')でしたら、「document.フォーム名.textオブジェクト名.value 」に値を入れれば反映されますが、ただの文字(ラベル)として反映させることはできないでしょうか？ DIVタグやLabelタグやPタグなど色々と試しましたがうまくできませんでした。 なにか良い方法をご存知のかたがおりましたら教えてください。
- ベストアンサー
- JavaScript
- JavascriptでAppletを制御したい
現在ＷＥＢアプリケーションを作成中ですが、 APPLETのPARAMETERの値を、 HTMLに記述した、JAVASCRIPTから書き換えられないか思案中です。 例 <APPLET> <Param name="AAA" value="2" > </APPLET> <INPUT TYPE="TEXT" NAME="BBB" VALUE="999"> <INPUT TYPE="BUTTON" NAME="RELOAD" VALUE="RELOAD"> のPARAMの値を変更したいのです。 このAAAのVALUE値を、BBBの値で変更して、RELOADボタンを押すと、 APPLETがPARAMを読み直して、再実行(RUNメソッド起動)するようにしたい。 APPLET側では現状ではINITメソッドでgetParameterを発行しています。 たぶんこれはRUNメソッドに移動しないといけないと思います。 よろしくお願いします。
- ベストアンサー
- Java
お礼
丁寧な回答をありがとうございました。 なるほど、色々と書き方があるんですね。 早速、試してみました。 これで問題が解決しました。 本当にありがとうございました！！