>  기사  >  웹 프론트엔드  >  js_form 특수 효과를 사용하여 선택 컨트롤을 작동하는 여러 가지 방법

js_form 특수 효과를 사용하여 선택 컨트롤을 작동하는 여러 가지 방법

WBOY
WBOY원래의
2016-05-16 18:25:421180검색

1 선택 옵션에 Value="paraValue"인 항목이 있는지 확인
2 선택 옵션에 항목 추가
3 선택 옵션에서 항목 삭제
4 선택 옵션에서 선택한 항목 삭제
5 select 옵션에서 value="paraValue"의 텍스트를 "paraText"로 수정
6 select에서 text="paraText"의 첫 번째 항목이 선택되도록 설정
7 value의 항목 설정 선택하려는 select의 ="paraValue"
8 현재 선택된 select 항목의 값을 가져옵니다
9 현재 선택된 select 항목의 텍스트를 가져옵니다
10 현재 선택한 항목의 Index를 가져옵니다. 선택
11 선택한 항목 지우기

================================== ================ ====================

js 코드
// 1 . 선택 옵션에 Value="paraValue"인 항목이 있는지 확인합니다.
function jsSelectIsExitItem(objSelect, objItemValue) {
var isExit =
for (var i = 0; i if (objSelect.options[i].value == objItemValue) {
isExit = true
break;
}
return isExit ;
}

// 2. 선택 옵션으로 이동하여 항목 추가
function jsAddItemToSelect(objSelect, objItemText, objItemValue) {
//존재 여부 확인
if ( jsSelectIsExitItem(objSelect, objItemValue)) {
alert("항목의 값이 이미 존재합니다. ");
} else {
var varItem = new Option(objItemText, objItemValue)
objSelect.options .add(varItem);
alert("성공적으로 추가됨");
}
}

// 3. 선택 옵션에서 항목 제거
function jsRemoveItemFromSelect(objSelect, objItemValue) {
//존재 여부 확인
if (jsSelectIsExitItem(objSelect, objItemValue) )) {
for (var i = 0; i if (objSelect.options[i].value == objItemValue) { objSelect.options.remove (i);
break;
}
}
alert("삭제되었습니다.") ;
} else {
alert("선택한 항목이 없습니다.")
}
}


// 4. 선택한 항목을 삭제합니다. select
function jsRemoveSelectedItemFromSelect(objSelect) {
var length = objSelect.options.length - 1
for(var i = length; i >= 0; i--){
if(objSelect) [i].selected == true){
objSelect.options[i] = null;
}
}
}

// 5. value=의 텍스트를 수정합니다. "paraText"에 대한 선택 옵션의 "paraValue"
function jsUpdateItemToSelect(objSelect, objItemText, objItemValue) {
//존재 여부 확인
if (jsSelectIsExitItem(objSelect, objItemValue)) {
for (var i = 0; i if (objSelect.options[i ].value == objItemValue) { objSelect.options[i].text = objItemText; 🎜>break;
}
}
alert("수정되었습니다");
} else {
alert("선택한 항목이 없습니다.");
}

// 6. select에서 text="paraText"의 첫 번째 항목을 Select로 설정
function jsSelectItemByValue(objSelect, objItemText) {
//존재 여부 확인
var isExit = false;
for (var i = 0; i if (objSelect.options[i].text == objItemText) {
objSelect .options[i].selected = true;
isExit = true; break;
}
}
//결과 표시
if (isExit) {
alert ("성공적으로 선택되었습니다.");
} else {
alert("선택한 항목이 없습니다.")
}
}

// 7. 선택 항목에서 값이 "paraValue"인 항목
function check(){
var c = document.all.objSelect
for (var i=0;iif (c.options(i).value==paraValue){
c.selectedIndex =i
} }
}


// 8. 현재 선택된 select 항목의 값을 가져옵니다
var currSelectValue = document.all.objSelect.value

// 9. 현재 선택된 select 항목의 텍스트를 가져옵니다.
var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text;

// 10. 현재 선택한 항목의 선택 인덱스 가져오기
var currSelectIndex = document.all.objSelect.selectedIndex;

// 11. 선택한 항목 지우기
document.all.objSelect.options.length = 0;

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.