- 締切済み
HTMLでテキスト入力し表示させる
HTMLでテキストボックスに文字を入力し、表示させたいのですがうまくできません。 見た目はできているようなのですが、文字が表示されない状態です。 コードを記載しますので、お手数をお掛けしますがご教授頂けますでしょうか。 <html> <head> <script> function add(){ document.getElementById("target").innerText = document.getElementById("name").value; target = document.getElementById("output"); document.write(target); } </script> </head> <body> <p>名前を入力してください</p> <input id="name" name="name" type="text" size="30" onkeydown="update_field();"> <br> <input type="button" onclick="add()" value="実行"> <form action="index.html" method="post"> <br> <input type="submit" name="exit" value="戻る"> </form> </body> </html>
- lacsuga
- お礼率0% (0/1)
- JavaScript
- 回答数1
- ありがとう数0
- みんなの回答 （1）
- 専門家の回答
みんなの回答
- t_ohta
- ベストアンサー率38% (5078/13267)
add() 関数の最初に getElementById("target") をしていますが、『target』というIDのタグがHTML内に存在しないのでエラーになっています。 次の行でも getElementById("output") をしていますが、『output』というIDのタグがHTML内に存在しないのでエラーになります。 その次に document.write(target) をしていますが、document.write はその処理のある場所に出力するので、<head> タグ内に書き出されるためブラウザの表示領域には何も表示されません。
関連するQ&A
- 『`』がテキストタイプのvalueにある場合にhiddenを追加すると表示が崩れる
言葉では説明できないためコードを記載致しました。 下記のコードでボタンを押下した場合に表示が崩れるのは何故でしょうか？（IE6,IE7で確認） 又、対策としてはどのような事が考えられるでしょうか？（『`』を入力禁止以外でお願い致します。） 尚、innerHTMLをalertで出すとうまく追加されていないようです。。。 よろしくお願い致します。 <html> <head> <script> function createhidden( name, value, formname ){ str = '<input type="hidden" name="aaa" value="bbb"/>'; document.forms[0].innerHTML += str; } </script> </head> <body> <form action="" name="form1"> <input type="text" name="b"value="`"/><br><br> <input type="button" value="CREATE HIDDEN" onclick="createhidden()"/> <input type="text" name="a"value="`"/><br><br> </form> </body> </html>
- ベストアンサー
- JavaScript
- 現在のカーソル行を知りたい。
'KeyDown'の下記サンプルコードでfunction msgにきたときに 何番目のテキストボックスでKYyDownされたか知りたいのですが、 関数があればお教え下さい。 <html> <head> <script type="text/Javascript"> <!-- function msg(str) { alert("check"); } //--> </script> </head> <body onKeyDown="msg('KeyDown')"> key<br> <form name="myForm" method="POST" target="_self"> <input type="text" name="text1><BR> <input type="text" name="text1"><BR> <input type="text" name="text1"><br> <input type="submit" name="button1" value="button"> </form> </body> </html>
- ベストアンサー
- JavaScript
- HTMLとJSでtxet内容を表示したい
下記のコードで質問があります。 仕様としてはtextに何かを書き込んで追加ボタンでテキストボックスの下に書き込んだ内容が表示され保存されるという風にしたいですが途中から何を書けばいいかわからなくなってしまいました。 ご指導お願いいたします <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <head> <body> <input type="text" id="form_txt"> <input type="button" width="50" value="追加" onclick="add_txt()"> <script> function add_txt() { var result = document.getElementById('form_txt'); /*ここからが何を書けばいいかわかりません・・・。*/ } </script> </body> </html>
- 締切済み
- JavaScript
- テキストボックス 追加
最初5つのテキストボックスを表示して追加ボタンを押して、6個目から15個目を追加しようとしています。name="tb1" からname="tb15"までを設定したいです。15個になった際にボタンを押せなくしたいです。入力された情報をPHP側で処理しようとしています。 以下のソースを改良しようとしているのですが、うまくいきません。 どのようにしたらいいでしょうか？ <script language="JavaScript"> <!-- function add(){ document.all.AddArea.innerHTML = document.all.AddArea.innerHTML + "<br><input type=\"text\" name=\"Txt_Object\">"; } // --> </script> </head> <body> <form id="f1"> <div id="AddArea"> <input type="text" name="Txt_Object"> </div> <input type="button" value="追加" onClick="add()"> </form> </body> </html>
- ベストアンサー
- JavaScript
- テキストフィールドへの値の表示
JavaScript初心者です。現在、言語習得のためのドリルをおこなっておりますが、２つのテキストフィールド間での値の受け渡しがうまくいきません。具体的には、上下２つのテキストフィールドがあり、上のフィールド（摂氏）に数値を入れボタンを押したタイミングで、その値を華氏に変換して下のフィールドに結果の値が表示される、またその逆もあり、というプログラムを作成したいのです。 テキストフィールドのvalueに値を格納すればよいのかと思い、いろいろな箇所で値を格納してみたのですが、うまく動きません。アドバイスをよろしくお願いいたします。 <html> <head> <script type="text/javascript"> var cel; var fah; function cel_to_fah( ) { cel=document.getElementById("c").value; fah=(9 * cel / 5) + 32 //document.write(fah); document.input_fah.c.value=fah; //return fah; } function fah_to_cel(){ fah= document.getElementById("f").value; cel= 5 * (fah - 32) / 9; //document.write(cel); document.input_cel.f.value=cel; //return cel; } </script> </head> <body> <form id="input_fah" action="./hw06-3.html" > Celsius: <input type="text" id="c" size="20" > <input type="button" onclick="cel_to_fah()" value="To Fahrenheit"/><br/><br/> </form> /* <script language="JavaScript"> document.input_fah.c.value=cel_to_fah(); </script> */ <form id="input_cel" action="./hw06-3.html" > Fahrenheir: <input type="text" id="f" size="20"> <input type="button" onclick="fah_to_cel()" value="To Celsius" /><br/><br/> </form> /* <script language="JavaScript"> document.input_cel.f.value=fah_to_cel( ) </script> */ </body> </html>
- ベストアンサー
- JavaScript
- jsでプルダウンで選択したものがうまく表示されない
以下のhtml文があります。 <!DOCTYPE html> <html> <head> <title></title> <script language="javascript" type="text/javascript"> function onButtonClick() { var val = document.forms.form1.textBox1.value; var target = document.getElementById("output"); if (val == "Penguin") { target.innerHTML = "合っています。"; } else { target.innerHTML = "間違っています。"; } } </script> </head> <body> <form action="" id="form1"> <div>"Penguin"と入力してください。</div> <input id="textBox1" type="text" value="" /> <input type="button" value="Exec" onclick="onButtonClick();" /> </form> <div id="output"></div> </body> </html> Penguinと入力すると合っていますと表示が出ます。 これを、プルダウン方式にしました。 <!DOCTYPE html> <html> <head> <title></title> <script language="javascript" type="text/javascript"> function selectboxChange() { var val1 = document.forms.form1.Select1.value1; var target = document.getElementById("output"); if (val1 == "要素1") { target.innerHTML = "合っています。"; } else { target.innerHTML = "間違っています。"; } } </script> </head> <body> <form name="form1" action=""> <select id="Select1" onchange="selectboxChange();"> <option>---</option> <option value1 == "要素1">要素1</option> <option>要素2</option> <option>要素3</option> <option>要素4</option> <option>要素5</option> </select> </form> <div id="output"></div> </body> </body> </html> これにすれば、要素１を選択すれば、会っていますと表示されるのですが、されません。 どうしたら改善されますか。
- ベストアンサー
- JavaScript
- 入力ホームが作動しない
私はプログラマーではありませんが、HTML、JAVAの辞典かってドリームウィバーで、個人のHPをつくっています。HPをリニューアルしようとしていまして、入力ホームを作っているのです。 <head> <script language="JavaScript"> <!-- fanction check(){ mail=document.form1.mail.value; if(document.form1.names.value==""){ alert("お名前を入力ください、Your name?") document.form1.names.forcus(); return false; }else if(mail.indexOf("@",0)<0){ alert("メールアドレスの入力を願います、Mail address?") document.form1.mail.forcus(); document.form1.mail.select(); return false; } alert("ありがとうございました。Thank you!") return true; } //--> </script> </head> <body><p><font color="#333333"> ＊ご依頼、お問い合わせなどは、メールにて。<br> 返信の際、電話番号などお知らせいたします。</font></p><hr> <form name="form1"action="～@bekkoame.ne.jp" Method="post" onSubmit="return check()"> お名前（name）:<input type="text"name="names"size="15"><p> メール（mail add）:<input type="text"name="mail"size="30"><p> 内 容（comment）:<br><textarea name="text"cols="40"rows="5"> </textarea> <input type="submit" value="送信"> </body> ですが、サファリでも、IE５でも作動しないのですが 何故なのかわからづに居ます。同じページに、メルマ！の入力ホームもあるのですがそれが良くないのでしょうか？そのソースは、melma!の発行タグをコピペしただけなので、問題は無いとおもうのですが、、、 action="送信したいメアド先"にしているのが間違いなのでしょうか、、、教えてください。
- ベストアンサー
- JavaScript
- 文字列でなくて数値として処理をしたい。
年度があって、2008 ボタンをクリックすると1を足して2009としたいのですが、文字列として扱われ20081となってしまいます。 数値として処理するにはどのように修正したらいいのでしょうか？ ご存知の方教えてください。 <script type="text/javascript"> function test(parts){ var result = document.getElementById('result'); nendo = document.tForm.y.value; if(nendo == ""){ document.tForm.msg.value = "2008"; } else {document.tForm.msg.value = nendo + 1; } } </script> </HEAD> <BODY> </p> <form name="tForm"> <p> <INPUT TYPE="text" NAME="msg" SIZE=20 id="y"> <br> <input type="button" name="" value="足し算" onClick="test(this)">
- ベストアンサー
- JavaScript
- JavaScript テキストボックス キーイベント
JavaScript テキストボックス キーイベント こんにちは。趣味でプログラミングをしている者です。 タイマーを使って計算ドリルを作ったのですが、 特定のキーコードで正解かどうか判定する関数を呼び出そうとしたのですが、 テキストボックスにこたえを入力して、キーを押すたびに 「キーン」というような音が鳴るのですが、 その音は、どのような仕組みで鳴るのでしょうか？ また、音を鳴らさないようにする方法がありましたら、 教えていただけないでしょうか よろしくお願いします <html> <head> <script type="text/javascript"> function init() { document.attachEvent("onkeypress", KotaeAwase); } function KotaeAwase() { if( event.keyCode == 13) { var key = 1; var kotae = parseInt( document.Form1.kotae.value ); var Result = document.Form1.result; if( kotae == key ) Result.value = "せいかいです!"; else Result.value = "ちがいます"; } } </script> </head> <body onLoad="init();"> <form name="Form1"> <input type="text" name="kotae" size="20"> <br><br> <input type="text" name="result" size="20"> <br> </form> </body> </html>
- ベストアンサー
- JavaScript
- ラジオボタンの選択に応じてインプットを表示する。
お世話になります。 現在、ラジオボタンの選択に応じてインプットのフィールドが表示されるようなHTMLフォームを作っているのですが、煮詰まってしまいました。どうしてもうまくいかないのですが、 <html> <head> <title>テスト</title> <script type="text/javascript"> <!-- function checkradio( disp ) { document.getElementById('input').style.display = disp; } //--> </script> </head> <body> <form action="xxx"> <p> <input type="radio" name="domain" id="1" value="1" onclick="checkradio('none');" /> <label for="1">選択１</label><br /> <input type="radio" name="domain" id="2" value="2" onclick="checkradio('none');" /> <label for="2">選択２</label><br /> <input type="radio" name="domain" id="3" value="3" onclick="checkradio('block');" checked /> <label for="3">選択３</label><br /> </p> <p id="input"> 選択３の詳細を書いてください。：<input type="text" id="input" name="select3" value="" size="20" /> </p> </form> </body> </html> と、こんな感じで、３を選択した時しかインプットを表示できません。選択１や選択２を表示した時には、「選択１の詳細を書いてください。」または「選択２の詳細を書いてください。」と表示させたいのですが、どこをどんな風に直せばいいでしょうか？ それと同時に初期画面ではこのインプットを非表示にしてラジオボタンを選択した時に表示されるようにしたいと思っています。 よろしくお願いします。
- ベストアンサー
- JavaScript
