user1502223
user1502223

Reputation: 645

Using Jquery with select tags

heres a fiddle to give you an idea of what im trying to do

http://jsfiddle.net/g4ymr/13/

<a href="">Menu 1</a>
<a href="">Menu 2</a>
<a href="">Menu 3</a>
<a href="">Menu 4</a>

<select name="type1">
   <option value="1">Menu 1</option>
   <option value="2">Menu 2</option>
   <option value="2">Menu 3</option>
   <option value="2">Menu 4</option>
</select>

Menu 1 2 3 4 represents my main Navigation on my website....

when a user clicks menu 2 i want the select tag form to go to menu 2

menu 3 when the user clicks on menu 3

and so on

I'm very new to jquery so i need help getting started

Upvotes: 2

Views: 1363

Answers (2)

Damo
Damo

Reputation: 11550

Using the anchors href attribute to point to the option means that the back/forward buttons would change the option as well. May or may not be required but worth knowing:

http://jsfiddle.net/EUZb3/

$("a").click(function(e) {
    $("select[name=type1]").val($(this).attr("href").substring(1))
});​

Upvotes: 0

Roko C. Buljan
Roko C. Buljan

Reputation: 206467

jsFiddle demo

$('a').click(function(e){
    e.preventDefault();
   $('select[name=type1] option').eq( $(this).index() ).prop('selected', true);
});

in this example I use the clicked button's .index() to reference ( targeting .eq() ) the desired option element. Hope I don't need to say you better use a more specific selector than just a. ...hmm I just said it :D

Upvotes: 3

Related Questions