- 締切済み
formとalert
javascript初心者です。 formを使ってテキストボックスに入力された文字をalertを使って表示させたいのですが、functionの中の記述がよくわかりません。 formを使った参考資料も見つからず質問するに至りました。 教えていただければと思います。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title>練習</title> <script type="text/javascript"> </script> </head> <body> <form name="a">文字を入力: <input type="text"size="20" name="name1" ><br> <input type="button" name="name2" value="確認" onclick="alert(chk)"> </form> <script type="text/javascript"> function chk(){ var n=document.a.name1.value; alert(n); } </script> </body> </html>
- gatangoton999
- お礼率27% (3/11)
- JavaScript
- 回答数3
- ありがとう数2
- みんなの回答 （3）
- 専門家の回答
みんなの回答
- kamepanman
- ベストアンサー率43% (19/44)
質問文の状態で <input type="button" name="name2" value="確認" onclick="alert(chk)"> を <input type="button" name="name2" value="確認" onclick="chk()"> に変更してみては、どうでしょうか？ 普通にでると思いますが。
- yambejp
- ベストアンサー率51% (3827/7415)
>ご指摘の通りに修正をするとアラートが動作をしなくなってしまいます。 ごめんなさい、方法を２種類かきましたが、 どちらの方法だとダメなんですか？
補足
どちらもアラートが表示されなくなるみたいです。 まだelementなど扱っていないので・・・ 時間をかけてゆっくりやってみます。
- yambejp
- ベストアンサー率51% (3827/7415)
formに名前をつけて管理をするのはできればやめた方がいい 必ずしもユニークにアクセスできないしブラウザによっては誤動作の元 オブジェクトで渡してやったり、idで指定する方がよい またalertでchkを呼んでおきながら、chkの中にさらにalertというのは 道理がおかしい <script> function chk(f){ var n=f.elements["name1"].value; alert(n); } </script> <form> <p>文字を入力: <input type="text"size="20" name="name1" ><br> <input type="button" name="name2" value="確認" onclick="chk(this.form)"> </form> とか <script> function chk(){ var n=document.getElementById("a").elements["name1"].value; return n; } </script> <form id="a"> <p>文字を入力: <input type="text"size="20" name="name1" ><br> <input type="button" name="name2" value="確認" onclick="alert(chk())"> </form> みたいにしてみるとよいでしょう。
補足
回答ありがとうございます。 ご指摘の通りに修正をするとアラートが動作をしなくなってしまいます。 ブラウザはIE9とgoogle chromeですが環境かmeta文などの構成が良くないのでしょうか。
関連するQ&A
- formについて
JavaScriptを使ったアンケートについて <html> <head> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <title>アンケート</title> <script type="text/javascript"> function Conf(){ a = document.forms[0].Email.value; if(a.match(/[a-zA-Z0-9_.]+@+[a-zA-Z0-9.]+$/)==null){ alert("間違っています"); } subWin=window.open("about:blank","form_data","width=300,height=300"); subWin.document.open(); subWin.document.write(a); subWin.document.close(); } </script> </head> <body> <form> <p>■メールアドレスを記入して下さい</p> <input type="text" name="Email" id="Email" size="40" /> <input type="button" value="確認" onClick="Conf()" /> </form> </body> </html> これだと、メルアドが間違っていますとalertが表示された後に、サブゥインドウが表示されてしまいます。 アンケートフォームを作りたくてJavaScriptを勉強中なのですが、メアドの入力が合っている場合のみサブゥインドウを表示させる方法が分からず、質問させて下さい。回答よろしくお願い申し上げます。
- ベストアンサー
- JavaScript
- FireFoxでfocus()が上手く動かない
javascriptを使って、 フォームのテキストエリアの入力文字数をチェックし、 オーバーしていれば、アラートを出し、テキストエリアにフォーカスを移動させる。 ようにしようとしています。 IEでは動いてのですが、FireFoxだと上手くフォーカスが移動してくれません。 どこがまずいのか、教えてください。 コード <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=euc-jp"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <script type="text/javascript"> <!-- function checkText(aText) { if (aText.value.length > 1) { alert('サイズオーバーです'); aText.focus(); } } //--> </script> </head> <body> <form method="post" action="#"> <input type="text" name="fmTitle" onBlur="checkText(this)"> <input type="text" name="dummy"> </form> </body> </html>
- ベストアンサー
- JavaScript
- formのボタンをsubmitしたときにアラート
javascript で、formのボタンをsubmitしたときに アラートが出るようにしたいと思います。 下記のように作ってみましたが、うまく動きません。 どのようにすれば動くでしょうか? ご教示いただきたくお願いいたします。 <script type="text/javascript"> function(){ $('form1').submit(function(){ $.ajax({ type: 'POST', data: postData, url: 'buy.php', success: function(data){alert("購入できました");} error: function(){alert('購入できませんでした。再度お試しください');} }); return false; }); } </script> <form name="form1" id="form1" method="POST" name="form1" value="form1" action="buy.php"> <input type="hidden" name="id" value="100" /> <input type="hidden" name="name" value="高橋" /> <input type="submit" value="Save"> <form/>
- ベストアンサー
- JavaScript
- 違う文字コードのページへＦＯＲＭデータを送る時
いつもお世話になっております。 EUC-JP のページからx-euc-jpのページへFORMを使いデータを渡しているのですが、どうも受け取り側で渡したデータが文字化けを起こしているようなのです。 原因が分かる方がいたら、ご教授下さい。 <HTML> <HEAD> <meta http-equiv="Content-Type" content="text/html; charset=EUC-JP" /> <script type="text/javascript"> <!-- function sent2() { document.INPUT.submit(); } // --> </script> </HEAD> <BODY onload="sent2()"> <form name="INPUT" METHOD="POST" action="http://okwave.jp" ENCTYPE="text/plain"> <input type="hidden" name="arr1" value="555006303003"> </form> </BODY> </HTML>
- 締切済み
- HTML
- inputの中身を書き換える方法について
下記で書き換え実行ボタンを押下すると、初期値1は変更後1に変わるのですが、初期値２と初期値３が変わりませんでした。 そのため、inputの中を書き換えるには、divの場合とは違う書き方をしないといけないのかと思ったのですが、どのように記述すればよいかわからなかったのでアドバイスいただける方がいらっしゃいましたら、ご教示の程、よろしくお願いします。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script language="JavaScript" type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> <!-- $(function(){ $("#change").click(function(){ $("#text1").html("変更後１"); $("#text2").html("変更後２"); $("#text3").html("変更後３"); }); }); // --> </script> <title>title</title> </head> <body> <form> <input id="change" type="button" value="書き換え実行" /> </form> <br /> <div id="text1">初期値１</div> <input type="text" name="text2" id="text2" value="初期値２" /> <input type="hidden" name="text3" id="text3" value="初期値３" /> </body> </html>
- ベストアンサー
- AJAX
- Event.observe について教えてください。
javascript および prototype.js について理解が中途半端なのですが、Event.observe() の 'click' 指定で、関数に引数を渡すにはどうしたらよいでしょうか？そんなことできないのでしょうか？ どういうことかといいますと、まず次のようなプログラムは動かすことが出来ました。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <script src="prototype.js" type="text/javascript"></script> </head> <body> test page <form name="form1"> <input type="button" name="exe" value="実行" id="b1" > </form> </body> </html> <script type="text/javascript"> function myfunc(){ return confirm('exe ?'); } Event.observe($('b1'), 'click', myfunc, false); </script> ------------------------------------- なのですが、この myfunc()関数に引数を与えれたらよいな、と思いまして、 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <script src="prototype.js" type="text/javascript"></script> </head> <body> test page <form name="form1"> <input type="button" name="exe" value="実行" id="b1" > </form> </body> </html> <script type="text/javascript"> function myfunc(a){ alert(a); return confirm('exe ?'); } Event.observe($('b1'), 'click', myfunc(3), false); </script> のようにしてみましたが、これは意図通り動かず、何故か画面をロードした時に、myfunc()関数も呼ばれているようです。 何分理解が中途半端なので、わたしがよく分かっていないことがあるのだと思いますが、どなたかご教授していただけたら嬉しいです。よろしくお願い致します。
- ベストアンサー
- JavaScript
- [fromについて] onClickを使用せず合計を出す方法はありますか？
割算の計算式なのですが、計算ボタンを押さずに数字を入力したら自動的に合計を出す方法がわかりません。＞＜； まったくの素人で困っています。何卒よろしくお願いいたします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title>かけ算、割り算（警告）</title> <script language="javascript" type="text/javascript"> <!-- function Calculate(){ var Div var a = document.calc_IN.data_A.value; var b = document.calc_IN.data_B.value; if(b == 0){ alert("0で割ることになります"); }else{ Div = a/b; document.calc_OUT.data_D.value=Div; } } // --> </script> </head> <body> <FORM NAME="calc_IN"> <INPUT NAME="data_A" TYPE="text" SIZE=10> <INPUT NAME="data_B" TYPE="text" SIZE=10> <INPUT NAME="GO" TYPE="button" VALUE="計算開始" onClick="Calculate()"> </FORM> <FORM NAME="calc_OUT"> 割り算：<INPUT NAME="data_D" TYPE="text" SIZE=10><BR> </FORM> </body> </html>
- 締切済み
- その他([技術者向] コンピューター)
- onChangeの使い方について教えてください。
javascriptで困っています。助けてください。 テキストボックスに入力された値をonChangeで検出し、入力内容をチェックしようとしています。 テキスト入力後、テキストボックスからフォーカスを外せば、問題なく作動するのですが、 テキストを入力し、フォーカスを外さずに、そのまま送信ボタンを押すと、 チェック結果を待たずに、次のファイル(画面)に移ってしまいます。 多分、onChangeを使う上で、よく発生する問題かと思うのですが、 みなさん、どのように回避されているのでしょうか？ <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=euc-jp"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <script type="text/javascript"> <!-- function check(){ alert('チェック'); } //--> </script> </head> <body> <form method="get" action="reg.php"> タイトル<br> <input type="text" name="title" onChange="check()"><br> <input type="submit" value="送信"><br> </form> </body> </html>
- ベストアンサー
- JavaScript
- form の checkbox の配列 name の選択値を confirm画面に出すには？
form の checkbox の name を配列で記述しました（ PHP で受け取るのに便利なので）が、checked value を confirm画面に出すことができません。 ご存知の方、お教えください。 ソースおよび分からない部分はつぎのとおりです。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www/w.w3.org/TR/REC-html14/loose.dtd"> <HTML> <HEAD> <META http-equiv=content-type content="text/html;charset=Shift_JIS"> <TITLE>よろしくお願いします。</TITLE> <META http-equiv=content-Style-type content="text/css"> <script type="text/javascript"> <!-- function conf(tfm) { wrt = "選択項目は以下でよろしいですか？\n\n" /* この部分に書くべき script がわかりません。 よろしくお願いいたします。m(_ _)m */ confirm ( wrt ) ; } //--> </script> </HEAD> <BODY> <form name=tfm action="http://localhost/form.php" method=post> <BR>選択してください。（複数選択可）<BR><BR> <input type=checkbox name="abc[]" value="A ">A, <input type=checkbox name="abc[]" value="B ">B, <input type=checkbox name="abc[]" value="C ">C, <input type=checkbox name="abc[]" value="D ">D, <input type=checkbox name="abc[]" value="E">E<BR><BR> <input type=button value="確 認" onClick="conf(tfm)"> <input type=reset value="キャンセル"> </form> </BODY> </HTML>
- ベストアンサー
- JavaScript
- ホームページでのジャバスクリプトについて
下記の記述でimport行を書くと構文エラーになりました。 解決方法を教えてください。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <META http-equiv="Content-Script-Type" content="text/javascript"> <TITLE>2013秋限定</TITLE> <SCRIPT language="JavaScript"> <!-- import javax.swing.JFrame; import javax.swing.JOptionPane; function chk8() { JFrame parent = ...; JOptionPane.showMessageDialog(parent, "合計が８個になっていません、\nもう一度入力してください。", "入力エラー", JOptionPane.WARNING_MESSAGE); return true; } //--> </SCRIPT> </HEAD> <BODY bgcolor="#ffffff"> ・ ・ ・ <INPUT type="button" value="購入する" onClick="chk8()"> ・ ・ ・ </BODY> </HTML>
- ベストアンサー
- JavaScript
補足
だめなようです・・・。