どのようにjavascriptが可能なので、ドロップダウンメニューの代わりに各値のボタンがありますか？

最初のドロップダウンメニューの代わりにボタンがあるので、ドロップダウンメニューの次の値セットの値を選択するためのJavaScriptコードに従うように助けてください。どのようにjavascriptが可能なので、ドロップダウンメニューの代わりに各値のボタンがありますか？

コードは次のとおりです。

<html> 
<head><title>JS example</title></head> 
<body> 
<script type="text/javascript"><!-- 

    // 
    var opt_one = new Array('blue', 'green', 'red'); 
    var opt_two = new Array('plaid', 'paisley', 'stripes'); 

    // 
    function updateTarget() { 
    var f = document.myform; 
    var which_r = null; 
    if (f) { 

     // first option selected? ("One") 
     if (f.trigger.value == '1') { 
     which_r = opt_one; 

     // ...or, second option selected? ("Two") 
     } else if (f.trigger.value == '2') { 
     which_r = opt_two; 

     // no known option, hide the secondary popup 
     } else { 
     f.target.style.display = 'none'; 
     } 

     // did we find secondary options for the selection? 
     if (which_r) { 

     // reset/clear the target pop-up 
     f.target.innerHTML = ''; 

     // add each option 
     for (var opt in which_r) { 
      f.target.innerHTML += '<option>' + which_r[opt] + '</option>'; 
     } 

     // display the secondary pop-up 
     f.target.style.display = 'inline'; 
     } 
    } 
    } // updateTarget() 

//--> 
</script> 
<form name="myform" action="#"> 
    <select name="trigger" onchange="updateTarget();"> 
    <option>Select one...</option> 
    <option>-</option> 
    <option value="1">One</option> 
    <option value="2">Two</option> 
    </select> 
    <select name="target" style="display:none;"> 
    </select> 
</form> 
</body> 
</html>

だから、私は何をしようとしていますが、それは言葉「ONE」と「TWO」の代わりのドロップダウン・メニューにあることを確認のボタンもあります。それはそれがclikedされるとき、それは指定された配列を持ち出すように。

ありがとうございます！

出典

2009-07-20 ron8

これが正しく動作するはずです。

<html> 
<head><title>JS example</title></head> 
<body> 
<script type="text/javascript"><!-- 

    // 
    var opt_one = new Array('blue', 'green', 'red'); 
    var opt_two = new Array('plaid', 'paisley', 'stripes'); 

    // 
    function updateTarget(button) { 
    var f = document.myform; 
    var which_r = null; 
    if (f) { 

     // first option selected? ("One") 
     if (button.name == 'one') { 
     which_r = opt_one; 

     // ...or, second option selected? ("Two") 
     } else if (button.name == 'two') { 
     which_r = opt_two; 

     // no known option, hide the secondary popup 
     } else { 
     f.target.style.display = 'none'; 
     } 

     // did we find secondary options for the selection? 
     if (which_r) { 

     // reset/clear the target pop-up 
     f.target.innerHTML = ''; 

     // add each option 
     for (var opt in which_r) { 
      f.target.innerHTML += '<option>' + which_r[opt] + '</option>'; 
     } 

     // display the secondary pop-up 
     f.target.style.display = 'inline'; 
     } 
    } 
    } // updateTarget() 

//--> 
</script> 
<form name="myform" action="#"> 
    <input name="one" type="button" onclick="updateTarget(this)" value="One"/> <input name="two" type="button" onclick="updateTarget(this)" value="Two"/> 
    <select name="target" style="display:none;"> 
    </select> 
</form> 
</body> 
</html>

出典

2009-07-20 13:08:20

ありがとうございます！それでおしまい！あなたは私を眠らせないような問題を助けてくれました！今私は今夜寝ることができます！ありがとうございます！ – ron8

あなたは、単に二つのボタンを作成して、ボタンのonClickイベントでupdateTarget()機能を呼び出すことができます：updateTarget()の署名はあなたがパラメータを渡すことができるように変更しなければならないということ

<input type="button" value="Option 1" onclick="updateTarget(1);" /> 
<input type="button" value="Option 2" onclick="updateTarget(2);" />

注意するようにあなたのコードそれに応じて分岐することができます：

function updateTarget(optionNumber) 
{ 
    if (optionNumber == 1) 
    ... 
    else if (optionNumber == 2) 
    ... 
    else 
    ... 
}

出典

2009-07-20 13:04:10 Cerebrus

どのようにjavascriptが可能なので、ドロップダウンメニューの代わりに各値のボタンがありますか？

答えて

関連する問題