JavaScript

jQuery SelectBox 사용

최강깜시 2014. 3. 11. 09:45

현재 선택되어진 select box의 값 읽기

// Get selected value
$("#myselectbox option:selected").val();

// Get selected text
$("#myselectbox option:selected").text();

// Get selected index
$("#myselectbox option").index($("#myselectbox option:selected"));

 

Select box의 Selected 값 설정

// Set the element at index 2 to be selected
$("#myselect option:eq(2)").attr("selected", "selected");

// Set the selected element by text
$("#myselect").val("Text1").attr("selected", "selected");

// Set the selected element by value
$("#myselect").val("Value1");


Select box의 option 추가

// Add option to the end of a select
$("#myselectbox").append("text1");

// Add option to the start of a select
$("#myselectbox").prepend("text1");

// Insert an item in after a particular position
$("#myselect option:eq(0)").after("Text4");

// Insert an item in before a particular position
$("#myselect option:eq(3)").before("Text5");


Select box의 option 변경

// Replace all the options with new options
$("#myselect").html("New Text1 New Text2");

// Replace items at a certain index
$("#myselect option:eq(1)").replaceWith("New Text2");


Select box의 option 삭제

// Remove an item at a particular index
$("#myselect option:eq(0)").remove();

// Remove first item
$("#myselect option:first").remove();

// Remove last item
$("#myselect option:last").remove();