2009-07-20 1 views
0

Я хотел бы помочь манипулировать следующим кодом 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> 

Так что я пытаюсь сделать, это сделать его, что слова «один» и «два», вместо того, чтобы быть в-понижающего раскрывающимся меню, то кнопка. Так что, когда он кликнут, он выдает свой заданный массив.

Спасибо заранее!

ответ

0

Если я правильно понял ваш вопрос, это должно сработать.

<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> 
+0

Спасибо !!! Это оно! У вас есть проблема, из-за которой я не спал! Теперь я могу спать сегодня вечером! Спасибо! – ron8

0

Вы можете просто создать две кнопки и вызовите функцию updateTarget() в onClick случае кнопок:

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

Обратите внимание, что подпись updateTarget() должна измениться, чтобы позволить вам передать параметр так, что ваш код может быть ответственно:

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

 Смежные вопросы

  • Нет связанных вопросов^_^