Q&A
↑これ<form>消さないとリロードされるのですが僕だけでしょうか・・・
<form>消してもvalueがうんだらとエラーが出ます
閲覧ありがとうございます。
表題の通りなのですが、どうも反応してくれません。
どこがダメなのか教えてください。
よろしくお願いいたします。
<!doctype html> <html> <head> <meta charset="utf-8"> <title>無題ドキュメント</title> <style> button{ color:white; background-color:#6EFFD8; } </style> </head> <p> 入力 </p> <form> <input type="text" id="inp1"> <button onClick="out()">押す</button> </form> <div id="out1">出力</div><body> </body> </html><style> var str = document.getElementById("inp1").value; str.innerHTML = out1; </style>
回答3件
0
とりあえず全部書き直してみました(´∀｀)
実行してみてください。
lang
1<!doctype html> 2<html> 3<head> 4 <title>テスト</title> 5 <script type="text/javascript"> 6 <!-- 7 function out() 8 { 9 var input = document.getElementById("inp1").value; 10 var output = document.getElementById("out1"); 11 output.innerHTML += (input + '<br>'); 12 } 13 //--> 14 </script> 15</head> 16<body> 17 入力<br> 18 <input type="text" id="inp1"><br> 19 <button onClick="out()">押す</button><br> 20 出力<br> 21 <hr> 22 <div id="out1"></div> 23</body> 24</html>
先ほどのソースの問題点は<style>と打ち間違えている以外にも、タイミングなどの問題があります。
lang
1 <style> // ⇐<script> 2 var str = document.getElementById("inp1").value; 3 //※左辺に代入するもの(書き変わる) 左辺に代入されるもの(書き変わらない) 4 str.innerHTML = out1; // ⇐ str と言う変数は文字なのでinnerHTMLというのはありません。 5 // out1は定義されてません。(定義されていても、おとなしくgetElementByIdしましょう(；´∀｀)) 6 // document.getElementById("out1").innerHTML = 文字; 7 </style> // ⇐</script>
先ほどのコードで動くようにしたものがこちら↓ 必要最小限のコードです(試行錯誤用)
lang
1 <script> 2 function out() { 3 // ID、inp1の内容を取得 4 var str = document.getElementById("inp1").value; 5 // 出力する<div>を取得(これを使って書き込みができます) 6 var output = document.getElementById("out1") 7 // いざ、書き込み 「+=」は追加 「=」は置き換えです 8 output.innerHTML += str; //追加してみる 9 } 10 </script>
ちなみに最小限のコードだけ書き換えると一瞬だけ表示されますが、formタグでリロードされてしまいます。
そんなときはformタグをはずしてみましょう。
投稿2015/06/08 13:55
総合スコア30
0
やっつけではありますが……
lang
1<script> 2function out() 3{ 4 var str = document.getElementById("inp1").value; 5 document.getElementById("out1").innerHTML = str; 6} 7</script>
投稿2015/06/08 13:46
総合スコア14
やり直した所<form>消してもエラー出ませんでした
お騒がせしました(_ _)
試したところ、まだどうもうまくいきませんでした。
回答ありがとうございました。
0
lang
1～省略～ 2 <style> 3 var str = document.getElementById("inp1").value; 4 str.innerHTML = out1; 5 </style> 6～省略～
の<style>は<script>でないといけません
※</style>の場合は</script>です
投稿2015/06/08 12:57
編集2015/06/08 12:58総合スコア258
うぁあぁああああはずかしい！！！
ありがとうございます！
直して実行してみたのですが、上手く動作しませんでした。他の部分でしたらどこが間違えていますかね？
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。