• 締切済み

プルダウン2つで別項目に値を代入したい.その2

同じような質問ですみません。プルダウン2つで別項目に値を代入する方法のアドバイスを参考にこんなの作ったんですがうまくいかないです。どこがおかしいですか? <html> <script type="text/javascript"> function hoge(){ var v1=document.getElementById('s1').value; var v2=document.getElementById('s2').value; var rslt; if (v1==1 && v2==1) { rslt=36; } else { if (v1==1 && v2==2) { rslt=29; } else { if (v1==1 && v2==3) { rslt=22; } else { if (v1==1 && v2==4) { rslt=14; } else { if (v1==1 && v2==5) { rslt=7; } else { if (v1==1 && v2==6) { rslt=0; } else { rslt='?'; }} document.getElementById('txt').value=rslt; } </script> <body> <select id="s1" onChange="hoge()"> <option value="1">1 <option value="2">2 <option value="3">3 <option value="4">4 </select>   <select id="s2" onChange="hoge()"> <option value="1">1 <option value="2">2 <option value="3">3 <option value="4">4 <option value="5">5 <option value="6">6 </select><p> <input type="text" id="txt" value=""> </body> </html>

  • h0130
  • お礼率87% (7/8)
  • Java
  • 回答数1
  • ありがとう数3

みんなの回答

回答No.1

まず、セレクトボックスの値が取れていません。 var v1=document.getElementById('s1').options[document.getElementById('s1').selectedIndex].value; var v2=document.getElementById('s2').options[document.getElementById('s2').selectedIndex].value; 次にv1とv2の値を判定しているif文が閉じられていません。 ところでv1=1以外の場合すべて?になるのは想定どおりですか?

h0130
質問者

お礼

確かに閉じられていませんでした。 動かない原因が分かったのでv1=1以外の場合はこれから入力していきます。どうもありがとうございました!

関連するQ&A

  • 同じようなのばかりだ申し訳ないのですが…javaに関してです。

    以下のようなプログラムを作成しました。3つのスクリプトを動作させたいのですがどうすればよいですか?また,画像のように(1)~(3)の和を算出するにはどうすればいいですか?助けて下さい。お願いします。 <html> <script type="text/javascript"> function hoge(){ var v1=document.getElementById('s1').value; var v2=document.getElementById('s2').value; var rslt; if (v1==1 && v2==1){ rslt=50; } else { if (v1==1 && v2==2) { rslt=47; } else { if (v1==2 && v2==1) { rslt=30; } else { rslt=20; }}} document.getElementById('txt1').value=rslt; } </script> <script type="text/javascript"> function hoge(){ var v1=document.getElementById('s1').value; var v3=document.getElementById('s3').value; var rslt; if (v1==1 && v3==1){ rslt=40; } else { if (v1==1 && v3==2) { rslt=80; } else { if (v1==2 && v3==1) { rslt=70; } else { rslt=10; }}} document.getElementById('txt2').value=rslt; } </script> <script type="text/javascript"> function hoge(){ var v1=document.getElementById('s1').value; var v4=document.getElementById('s4').value; var rslt; if (v1==1 && v4==1){ rslt=83; } else { if (v1==1 && v4==2) { rslt=53; } else { if (v1==2 && v4==1) { rslt=33; } else { rslt=13; }}} document.getElementById('txt3').value=rslt; } </script> <body> <select id="s1" onChange="hoge()"> <option value="1">1<option value="2">2 </select>   <select id="s2" onChange="hoge()"> <option value="1">1<option value="2">2 </select>   <select id="s3" onChange="hoge()"> <option value="1">1<option value="2">2 </select> <select id="s4" onChange="hoge()"> <option value="1">1<option value="2">2 </select><p> <input type="text" id="txt1" value=""><p> <input type="text" id="txt2" value=""><p> <input type="text" id="txt3" value=""> </body> </html>

    • ベストアンサー
    • Java
  • javaScriptのif文について…

    以下のようなプログラムを作成しました。作ったのはサンプルで、本当に作りたいのはもっと条件が多いのを作りたいのですが、かなりifの羅列となってしまいます。他に何か良い方法はありませんか?教えてくださいm(__)M <html> <script type="text/javascript"> function hoge(){ var v1=document.getElementById('s1').value; var v2=document.getElementById('s2').value; var rslt; if (v1==1 && v2==1) { rslt=36; } else { if (v1==1 && v2==2) { rslt=29; } else { if (v1==1 && v2==3) { rslt=22; } else { if (v1==1 && v2==4) { rslt=14; } else { if (v1==1 && v2==5) { rslt=7; } else { if (v1==1 && v2==6) { rslt=0; } else { rslt='?'; }} document.getElementById('txt').value=rslt; } </script> <body> <select id="s1" onChange="hoge()"> <option value="1">1 <option value="2">2 <option value="3">3 <option value="4">4 </select>   <select id="s2" onChange="hoge()"> <option value="1">1 <option value="2">2 <option value="3">3 <option value="4">4 <option value="5">5 <option value="6">6 </select><p> <input type="text" id="txt" value=""> </body> </html>

  • JavaScriptの計算のNaNの判定について…

    いろいろなアドバイスを参考に以下のようなプログラムを作り、値が正の時はちゃんと計算されるのですが負の時はNaNと判定されてしまいます。どうしたら負の場合でもちゃんと計算されますか?いろいろ調べたのですが見つかりませんでした…。よろしくお願いします。 <html> <body> <script type="text/javascript"> var rslt1 = 0; var rslt2 = 0; var rslt3 = 0; function hoge1(){ var a=document.getElementById('a').value; var b=document.getElementById('b').value; var rslt; if (a==1 && b==1) { rslt1=-100; } else { if (a==1 && b==2) { rslt1=-90; } else { if (a==2 && b==1) { rslt1=-80; } else { rslt1=-70; }}} document.getElementById('txt1').value=rslt1; sum1(); } function hoge2(){ var a=document.getElementById('a').value; var c=document.getElementById('c').value; var rslt; if (a==1 && c==1) { rslt2=-95; } else { if (a==1 && c==2) { rslt2=-85; } else { if (a==2 && c==1) { rslt2=-75; } else { rslt2=-65; }}} document.getElementById('txt2').value=rslt2; sum1(); sum2(); } function hoge3(){ var a=document.getElementById('a').value; var d=document.getElementById('d').value; var rslt; if (a==1 && d==1) { rslt3=-60; } else { if (a==1 && d==2) { rslt3=-50; } else { if (a==2 && d==1) { rslt3=-40; } else { rslt3=-30; }}} document.getElementById('txt3').value=rslt3; sum2(); } function sum1() { document.getElementById('txt4').value=rslt1 + rslt2; } function sum2() { document.getElementById('txt5').value=rslt2 + rslt3; } function sum3() { document.getElementById('txt6').value=((document.getElementById('txt4').value + rslt2 + document.getElementById('txt5').value * 2) / 4); } </script> <select id="a" onChange="hoge1()"> <option value="1">1<option value="2">2 </select>   <select id="b" onChange="hoge1()"> <option value="1">1<option value="2">2 </select>   <select id="c" onChange="hoge2()"> <option value="1">1<option value="2">2 </select> <select id="d" onChange="hoge3()"> <option value="1">1<option value="2">2 </select><p> <input type="text" id="txt1" value=""><p> <input type="text" id="txt2" value=""><p> <input type="text" id="txt3" value=""><p> <input type="text" id="txt4" value=""><p> <input type="text" id="txt5" value=""><p> <input type="text" id="txt6" value=""><p> </body> </html>

  • javaの計算に関する質問です。

    以下のプログラムで、画像の矢印のように処理ができたのですが、(4)と(5)の計算値などを用いて更に計算をするにはどう記述すればよいのですか?できれば画像の赤○で囲ったような感じで四則演算したいのですが…よろしくお願いします。 <html> <body> <script type="text/javascript"> var rslt1 = 0; var rslt2 = 0; var rslt3 = 0; function hoge1(){ var a=document.getElementById('a').value; var b=document.getElementById('b').value; var rslt; if (a==1 && b==1) { rslt1=100; } else { if (a==1 && b==2) { rslt1=90; } else { if (a==2 && b==1) { rslt1=80; } else { rslt1=70; }}} document.getElementById('txt1').value=rslt1; sum1(); } function hoge2(){ var a=document.getElementById('a').value; var c=document.getElementById('c').value; var rslt; if (a==1 && c==1) { rslt2=95; } else { if (a==1 && c==2) { rslt2=85; } else { if (a==2 && c==1) { rslt2=75; } else { rslt2=65; }}} document.getElementById('txt2').value=rslt2; sum1(); sum2(); } function hoge3(){ var a=document.getElementById('a').value; var d=document.getElementById('d').value; var rslt; if (a==1 && d==1) { rslt3=60; } else { if (a==1 && d==2) { rslt3=50; } else { if (a==2 && d==1) { rslt3=40; } else { rslt3=30; }}} document.getElementById('txt3').value=rslt3; sum2(); } function sum1() { document.getElementById('txt4').value=rslt1 + rslt2; } function sum2() { document.getElementById('txt5').value=rslt2 + rslt3; } </script> <select id="a" onChange="hoge1()"> <option value="1">1<option value="2">2 </select>   <select id="b" onChange="hoge1()"> <option value="1">1<option value="2">2 </select>   <select id="c" onChange="hoge2()"> <option value="1">1<option value="2">2 </select> <select id="d" onChange="hoge3()"> <option value="1">1<option value="2">2 </select><p> <input type="text" id="txt1" value=""><p> <input type="text" id="txt2" value=""><p> <input type="text" id="txt3" value=""><p> <input type="text" id="txt4" value=""><p> <input type="text" id="txt5" value=""><p> </body> </html>

    • ベストアンサー
    • Java
  • プルダウンを2個選び、その結果に基づき、値を返す。

    プルダウンを2個選び、その結果に基づき、値を返したいです。 以下はそのhtml文です。 <!DOCTYPE html> <html> <head> <title>プルダウンのメニューを表示を2つ設定</title> <script> function selectboxChange() { var value1 = document.forms.form1.Select1.value; var value2 = document.forms.form11.Select11.value; var target = document.getElementById("output11"); if ((value == "要素1")&&(value == "要素11")) { target.innerHTML = "合っています。"; } else { target.innerHTML = "間違っています。"; } } //--------------------- // </script> </head> <body> <div>プルダウンのメニュー1</div> <form name="form1" action=""> <select id="Select1" onchange="selectboxChange();"> <option>---</option> <option value="要素1">要素1</option> <option>要素2</option> <option>要素3</option> <option>要素4</option> <option>要素5</option> </select> </form> <div>プルダウンのメニュー2</div> <form name="form11" action=""> <select id="Select11" onchange="selectboxChange();"> <option>---</option> <option value="要素11">要素1</option> <option>要素2</option> <option>要素3</option> <option>要素4</option> <option>要素5</option> </select> </form> <div id="output11"></div> </body> </html> プルダウンを2個紐づけたいのですが、var value=document.formsの文言を紐づけようとしましたが、 紐づけができません。 ですので、打開案をご教授願えたら幸いです。

  • プルダウンで別項目に値を代入したい(HTML SELECT)

    ホームページのプルダウン項目を選択すると直ぐ下にあるテキスト項目に値を設定するプログラムを作りたいのですが上手くいきません。 HTMLのSELECT句でonchange属性に記述するのは分りますが、その場合にはjavascriptで記述(例:onchange="fncSet();"等)します。 下記は記述を省略しましたが、option項目はDBのテーブルから読み込んでセットしています。 <select name=sel onchange="???">  <option value=" "> </option>  <option value="1">はい</option>  <option value="2">いいえ</option> </select> <input type=text name=txt value=""> この場合にselのonchangeで選択した項目の値をtxtに設定するにはどうすればいいのでしょうか? OS   :WIN2K ブラウザ :IE6 プログラム:HTML(asp,vbscript,javascript)

    • ベストアンサー
    • HTML
  • プルダウンのメニューを表示を2つ設定。

    プルダウンのメニューを表示を2つ設定したいのですが、 どこが間違っているのでしょうか。 基本的にjsは、セレクタ名がかぶっていれば、機能しなくなります。 間違いをご指摘ください。 <!DOCTYPE html> <html> <head> <title></title> <script language="javascript" type="text/javascript"> function selectboxChange() { var val1 = document.forms.form1.Select1.value; 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> <script language="javascript" type="text/javascript"> function selectboxChange11() { var val11 = document.forms.form11.Select11.value; var target = document.getElementById("output11"); if (val11 == "要素11") { target.innerHTML = "合っています。"; } else { target.innerHTML = "間違っています。"; } } </script> </head> <body> <form name="form11" action=""> <select id="Select11" onchange="selectboxChange11();"> <option>---</option> <option value11 == "要素11">要素1</option> <option>要素2</option> <option>要素3</option> <option>要素4</option> <option>要素5</option> </select> </form> <div id="output11"></div> </body> </body> </html>

  • IDの取得、繰り返しに問題があるようなんですが・・・

    複数のセレクトの中から選んだ内容をコピーするスクリプトなんですが、 function answerPut(){ var answer = document.getElementById("s1"); var answerCopy = document.getElementById("answer"); answerCopy.value=answer.value } ▲このように単独で1つのフォームからならコピーできたのですが これを複数のフォームに対応させるためにforを使ってみたのですが どうにもうまくいきません。お知恵を拝借いただければ幸いです。 ▼うまくいかないスクリプト <html> <body> <script type="text/javascript"> function answerPut(){ for(var i=1; i<=3; i++){ var answer = document.getElementById(id+i); var answerCopy = document.getElementById("answer"); answerCopy.value=answer.value } } </script> (1)<select name="" id="s1" onChange="answerPut();"> <option value="あ1">あ1</option> <option value="い1">い1</option> <option value="う1">う1</option> </select> (2)<select name="" id="s2" onChange="answerPut();"> <option value="あ2">あ2</option> <option value="い2">い2</option> <option value="う3">う2</option> </select> (3)<select name="" id="s2" onChange="answerPut();"> <option value="あ1">あ3</option> <option value="い2">い3</option> <option value="う3">う3</option> </select> <br> <br> ▼選んだ回答内容が入る<br> <input type="text" name="9" value="" size="40" id="answer"> </body> </html>

  • プルダウンをもう一つ増やしたい&フレームページで使用のため、別ウインドウで表示させたい

    ↓他サイトさんにてサンプルで置いてあったものを拝借して自分なりにやってみました。 1、これをさらにもうひとつプルダウンを選択させて他サイトへジャンプさせる場合はどのようにしたらよいですか。 2、フレームページで使うので、他サイトの表示を別ウインドウで表示させたいのですが、どのようにしたらよいですか。 よろしくお願いします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN""http:///www.w3.org/TR/html4/frameset.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title></title> <script type="text/javascript" language="JavaScript"> <!-- function showthis(obj) { if(!obj) return false; if(document.getElementById) { document.getElementById("item1").style.display = "none"; document.getElementById("item2").style.display = "none"; document.getElementById("item3").style.display = "none"; document.getElementById(obj).style.display = "inline"; } else { return false; } } // --> </script> <style type="text/css"> #item1,#item2,#item3 { display: none; } </style> </head> <body> <form> <select onchange="showthis(this.value)"> <option selected="selected">選んでください</option> <option value="item1"></option> <option value="item2"></option> <option value="item3"></option> </select> <select id="item1" onchange="location=this.value"> <option selected="selected">選んでください</option> <option value=""></option> <option value=""></option> <option value=""></option> </select> <select id="item2" onchange="location=this.value"> <option selected="selected">選んでください</option> <option value=""></option> <option value=""></option> <option value=""></option> </select> <select id="item3" onchange="location=this.value"> <option selected="selected">選んでください</option> <option value=""></option> <option value=""></option> <option value=""></option> </select> </form> </body> </html>

  • いつも参考にさせて頂いています。

    いつも参考にさせて頂いています。 javascriptでセレクトメニューを作っているのですが うまく出来ないのでどなたか教えて下さい。 宜しくおねがいします。 3連動するセレクトメニューで 3つ目のセレクトメニューを選ぶと 選ばれた項目に対応するURLに飛ぶように作っています。 ここからが質問なのですが、 ページに飛んだ時にセレクトメニューで選択した内容が消えてしまいます・・・ 飛んだ先のページでも、選択した内容を表示させるには どのようにすればいいのでしょうか? ご存知の方がいましたら教えて下さい。 ---html部分---- <html> <head> <script type="text/javascript" src="test.js"></script> </head> <body> <form id="f0"> <select id="s0"> <option value="">----------------</option> </select> <select id="s1"> <option value="">----------------</option> </select> <select id="s2"> <option value="">----------------</option> </select> </form> </body> </html> ---外部javascriptファイル---- var data= { 吉野家: { "牛丼(並)":{0:"380円"}, "牛丼(大盛)":{1:"480円"}, "牛丼(特盛)":{2:"630円"} } ,松屋: { "牛丼(並)":{3:"320円"}, "牛丼(大盛り)":{4:"420円"}, "牛丼(特盛)":{5:"520円"} } ,すき家: { "牛丼(並)":{6:"280円"}, "牛丼(大盛)":{7:"380円"}, "牛丼(特盛)":{8:"480円"} }; window.onload=function(){ s0=document.getElementById("s0"); s1=document.getElementById("s1"); s2=document.getElementById("s2"); setSelect(data,s0); s0.onchange=function(){ clearSelect(s2); if(this.value==""){ clearSelect(s1); }else{ setSelect(data[this.value],s1); } } s1.onchange=function(){ if(this.value==""){ clearSelect(s2); }else{ setSelect(data[s0.value][this.value],s2); } } s2.onchange=function(){ location.href="/////////"; } } function setSelect(obj,sel){ while(lc=sel.lastChild){ sel.removeChild(lc); }; var op=document.createElement("option"); op.setAttribute("value",""); op.appendChild(document.createTextNode("----------------")); sel.appendChild(op); for(var i in obj){ var txt=(typeof obj[i]=="object")?i:obj[i]; var op=document.createElement("option"); op.setAttribute("value",i); op.appendChild(document.createTextNode(txt)); sel.appendChild(op); } } function clearSelect(sel){ while(lc=sel.lastChild){ sel.removeChild(lc); }; var op=document.createElement("option"); op.appendChild(document.createTextNode("----------------")); sel.appendChild(op); };

専門家に質問してみよう