개선된 버전: select_form 효과의 옵션 요소 추가, 수정 및 삭제

오늘 연차휴가를 마치고 집에 돌아오면서 Xiao Lin이 QQ에 게시한 "모니터링 및 관리 데모 코드"를 봤습니다. 핵심 원리는 select 요소의 add() 메소드입니다:

코드 복사 코드는 다음과 같습니다.

function watch_ini(){ // 초기
for(var i=0; i var word = document.createElement("OPTION");
word.text = 인수[i]
watch.keywords.add(word); watch.는 양식 이름입니다
}
}
function watch_add(f){ //
추가 var word = document.createElement("OPTION")
word.text = f.word .value;
f.keywords.add(word);

그러나 위의 add() 메소드는 FF 및 Opera와 호환되기 위해서만 유효합니다. , 위의 코드가 개선되었습니다. ：

코드 복사 코드는 다음과 같습니다.

function watch_ini(){ // 초기
for(var i=0; i var oOption=new Option(arguments[i],arguments[i ]);
document.getElementById("MySelect").options[ i]=oOption
}
}
function watch_add(f){ //
var oOption=new 옵션 추가 (f.word.value,f.word.value);
f.keywords.options[f.keywords.length]=oOption;
}

전체 인스턴스의 코드는 다음과 같습니다.

javascript 선택 옵션 텍스트 값<title> </title> <meta name="keywords" content="javascript select options text value add modify delete set"> <meta name="description" content="javascript select options text value add modify delete set"> <form name="watch" method="post" action=""> <select id="MySelect" name="keywords" size="10" onchange="watch_sel(this.form)"></select> <input type="text" name="word"> <input type="button" value="增加" onclick="watch_add(this.form);"> <input type="button" value="修改" onclick="watch_mod(this.form);"> <input type="button" value="删除" onclick="watch_del(this.form);"> <input type="button" value="保存" onclick="watch_set(this.form);"> </form>
[Ctrl A 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다

]