Show/Hide

Discussion in 'JavaScript' started by adamjblakey, Jun 10, 2009.

0
  1. #1
    Hi,

    I have a function which works fine by using a link e.g.

    <a href="javascript:;" onClick="change1('div1'); return false;">Change</a>
    Code (markup):
    But i want to adapt this to a selection list. I tried this but does not work. Please advise:

    
<select name="">
  <option value="shoes" onchange="change('div1'); return false;">shoes</option>
</select
    Code (markup):
    Thank you in advance.
    Adam
     
    adamjblakey, Jun 10, 2009 IP
  2. clarky_y2k3

    clarky_y2k3 Well-Known Member

    Messages:
    114
    Likes Received:
    9
    Best Answers:
    0
    Trophy Points:
    108
    #2
    Use the onchange event on the select instead of the option.
     
    clarky_y2k3, Jun 10, 2009 IP
  3. adamjblakey

    adamjblakey Active Member

    Messages:
    1,121
    Likes Received:
    10
    Best Answers:
    0
    Trophy Points:
    80
    #3
    It is going to be a difference onchange though for each option.
     
    adamjblakey, Jun 10, 2009 IP
  4. clarky_y2k3

    clarky_y2k3 Well-Known Member

    Messages:
    114
    Likes Received:
    9
    Best Answers:
    0
    Trophy Points:
    108
    #4
    You can use onclick for the option elements or alternatively use onchange on the select and handle the selected index or value.

    Using onclick for option elements means that if the selection is made using the keyboard the onclick event will (obviously) not be triggered. This can be avoided by using the onchange event on the select.

    Here's an example:-
    <html>
<head>
<script type="text/javascript">
function handleChange(sValue)
{
    switch(sValue)
    {
        default:
            break;
        case '1':
            alert('One');
            break;
        case '2':
            alert('Two');
            break;
    }
}
</script>
</head>

<body>
  <select name="a" onchange="handleChange(this.value);">
    <option value="">Please Select</option>
	<option value="1">One</option>
	<option value="2">Two</option>
  </select>
</body>
</html>
    HTML:
     
    clarky_y2k3, Jun 10, 2009 IP