2012-12-14 4 views
1

드롭 다운 상자 (자바 스크립트 사용)에서 주어진 var에 따라 주어진 옵션 이름을 선택할 수있는 함수를 작성하는 데 도움이 필요하며 값 존재하지 않으면 드롭 다운 목록에 추가 한 다음 선택하십시오.드롭 다운 상자에서 옵션 값 추가 및 선택

예 :

<html> 

<head> 

<script type="text/javascript"> 

function test() { 

var option_name_to_look_for = "mangos" 

if option_name_to_look_for is listed in the drop down box (drop) then select it 

if the option_name_to_look_for is not listed in the drop down box (drop), automatically add it to the drop down list (drop) and select it. 

} 

</script> 

</head> 

<body> 

<select id="drop" style="width: 200px;"> 
<option value="0"></option> 
<option value="1">apples</option> 
<option value="2">oranges</option> 
<option value="3">pears</option> 
<option value="4">mangos</option> 
<option value="5">bananas</option> 
<option value="6">kiwis</option> 

</select> 

</body> 

</html> 
+1

작동중인 js가 있습니까? 그렇다면 우리는 바이올린을 얻을 수 있습니까? –

답변

1

비 jQuerified 버전!

function selectMe(name){ 
    var select = document.getElementById("drop"), 
     options = select.options, 
     found = false; 

    //Search for it! 
    for (var x=0; x<options.length; x++){ 
    if(options[x].text==name){ 
     options[x].selected=true; 
     found = true; 
     break; 
    } 
    } 

    //if it isn't found, add it! 
    if(!found){ 
    var option = document.createElement("option"); 
    option.text = name; 
    option.value = options.length; 
    select.appendChild(option); 
    option.selected=true; 
    } 
} 

selectMe("mangos"); 
1

는 jQuery를 사용하여 :

var found = false; 
var search = 'something not in the list'; 
$("#drop").children().each(function() { 
    if($(this).html() == search) { 
     found = true; 
     $(this).attr('selected', true); 
     return; 
    } 
}); 
if(!found) { 
    var nextValue = $("#drop").children(":last").val() + 1; 
    $("#drop").append('<option value="' + nextValue + '">'+search+'</option>'); 
    $("#drop").children(":last").attr('selected', true); 
} 

http://jsfiddle.net/Zhk5w/1/