[javascript] 자바스크립트 셀렉트(select) 초기화 , 넣기 , 빼기 , 값읽기
1. select(셀렉트) 원위치
$('#reset').click(function () {
$("#client_cos option:eq(0)").prop("selected", true);
//처음 위치로 돌아가기
});
2. select(셀렉트) 요소 삭제하기
$('#delete').click(function () {
$("#client_cos option:eq(0)").remove();
//첫번째 위치 지우기
});
3. select(셀렉트) 요소 추가하기
$('#add').click(function () {
$("#client_cos").append("<option> 10 </option>");
//마지막 위치에 넣기
});
3. select(셀렉트) 특정 위치 요소 추가하기
$('#third_add').click(function () {
$("#client_cos option:eq(3)").after("<option> 1111 </option>");
//3번째 이후부터 넣기
});
4. select(셀렉트) 값과 인덱스 알기
$('#check').click(function () { // 값과 위치를 알기
var index = $("#client_cos option").index($("#client_cos option:selected"));
var select_val = $("#client_cos option:selected").val();
alert('선택 인덱스 =' + index + ' 선택한 값 ' + select_val);
});
See the Pen select by Nami (@NamuNami) on CodePen.
전체 테스트 코드
'[javascript]' 카테고리의 다른 글
jsp servlet(서블렛)를 통한 ajax, JsonObject, JsonObject key value 편 (0) | 2018.04.21 |
---|---|
jsp servlet(서블렛)를 통한 ajax, object 편 (0) | 2018.04.21 |
[javascript] 자바스크립트 날짜 입력받기 (input date 날짜 받기) , datepicker (0) | 2018.04.19 |
[javascript] 자바스크립트 배열(Array) 문자 , 숫자 , 날짜 정렬(Sort)하기 (0) | 2018.04.17 |
[javascript] 자바스크립트 배열(Array) 선언과 확인하기( isArray() ) 와 typeof()로 확인 안되는 이유 (0) | 2018.04.17 |