Jquery / selectbox chage event 제어

[WonYong-Jang]

change event

• 아래 두가지 방법으로 가능

this.value == $(this).val() /////////// ==> 같은 표현

선택된(selected) value 가져오기

$("#select1 option:selected").val();
또는
$("#select1 option:selected").attr("value");

선택된(selected) text 가져오기

$("#select1 option:selected").text();
==> select list 에 직접 보여지는 텍스트 

셀렉트박스안의 아이템 갯수 구하기

$("#select1 option").size();
$("#select1 option").length;

// 선택값 전까지 갯수 (선택값 포함 안됨 ) 
$("#select1 option:selected").prevAll().size();
$("#select1 option:selected").prevAll().length;

// 선택값 이후의 갯수 (선택값 포함 안됨)
$("#select1 option:selected").nextAll().size();
$("#select1 option:selected").nextAll().length;

선택된 아이템 index 가져오기, 선택하기

// 선택된 index 아이템 가져오기 / 0부터 시작 
var pos = $("#select1 option").index($("#select1 option:selected"));

아이템 삭제하기

index 0번 부터 시작 
$("#select1 option:eq(1)").remove(); // 1번 인덱스 삭제 
$("#select1 option:first").remove();
$("#select1 option:last").remove();

아이템 추가하기

// 마지막에 추가 
$("#select1").append("<option>aa</option>");
// 최상단에 추가 
$("#select1").prepend("<option>bb</option>");
// 특정 아이템 아래 추가 
$("#select1 option:eq(1)").after("<option>cc</option>");
// 특정 아이템 위에 추가 
$("#select1 option:eq(1)").before("<option>dd</option>");

참고 : https://m.blog.naver.com/PostView.nhn?blogId=chsmanager&logNo=220269409239&proxyReferer=https%3A%2F%2Fwww.google.com%2F