jQuery SelectBox 사용

2014. 3. 11. 09:45JavaScript

현재 선택되어진 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();

 

'JavaScript' 카테고리의 다른 글

[Javascript] var, let 그리고 const의 차이  (0) 2017.11.21
배경화면을 이용한 슬라이드  (2) 2015.10.23
Datepicker 시간 선택 Plugin  (0) 2015.05.18
jQuery Radio 버튼처리  (0) 2014.03.11
Facebook, Twitter, Metoday 연동  (0) 2014.03.11