2011-08-09 5 views
3

버튼을 눌러 jQuery로 <option> 항목을 선택할 수 있습니까? 예를 들어버튼으로 jQuery 선택 옵션

:

<a id="item1" href="#">Item 1</a> 
<a id="item2" href="#">Item 2</a> 
<a id="item3" href="#">Item 3</a> 

<form> 
....... 
<select id="items" name="items"> 
<option value="1">I dont know</option> 
<option value="2">Item 1</option> 
<option value="3">Item 2</option> 
<option value="4">Item 3</option> 
</select> 
......... 

</form> 

당신이 형태보다 두 번째 버튼을 누르면 자동으로 두 번째 옵션을 선택합니다. 가능한가?

답변

3

입니다.

$('a').click(function() { 
    var select_num = $(this).index() + 1; 
    $('#items option').eq(select_num).attr('selected', 'selected'); 
}); 

여기서 예 fiddle.

0

이 (항목 2 링크리스트에서 항목을 선택 2) 시도 : 각 버튼/링크

$('#item2').click(function(){ 
    $('#items option:nth-child(3)').attr('selected', 'selected'); 
}); 

유사한 기능.

+0

이고 그래서이다. 동적으로 작동하도록 만드는 방법에 대한 아이디어가 있습니까? – Phil

+0

동적으로 수행하는 방법에 대한 내 게시물을보십시오. – Kyle

0

이 시도 :

$('#item1').click(function() { 
    $('#items option[value="2"]').attr('selected', true); 
}); 

여기를 참조하십시오 : http://jsfiddle.net/RVUDa/

+0

이것은 정적입니다 ... – Phil

0

이 ID로 블록 요소에 태그를 감 쌉니다. 이렇게하면 목록에있는 각 항목에 대해 하나의 수신기 대신 하나의 수신기 만 있기 때문에 클릭 할 항목이 많을 때 더욱 효율적으로 사용할 수 있습니다.

<div id="buttons"> 
    <a id="item1" href="#">Item 1</a> 
    <a id="item2" href="#">Item 2</a> 
    <a id="item3" href="#">Item 3</a> 
</div> 

는 그런 다음 jQuery 코드를 위해, 당신이 할 수 있습니다 :이 그것을하고 간단한의 jQuery 방법은

$('#buttons').click(function(e) 
{ 
    var num = $(e.target).index() + 1; 
    $('option:nth-child(' + num + ')', '#items').attr('selected', 'selected'); 
});