>  기사  >  웹 프론트엔드  >  선택 제어 options_javascript 기술의 옵션을 추가, 삭제, 수정 및 확인하기 위한 JS 샘플 코드

선택 제어 options_javascript 기술의 옵션을 추가, 삭제, 수정 및 확인하기 위한 JS 샘플 코드

WBOY
WBOY원래의
2016-05-16 17:19:31977검색

Javascript 작업 select는 일반적인 유형의 동적 JS 작업 선택 방법입니다.

코드 복사 코드

//동적으로 선택 생성
function createSelect()
{
var mySelect = document.createElement("select")
mySelect .id = "mySelect";
document.body.appendChild(mySelect);
}

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

//옵션 옵션 추가
function addOption()
{
//id를 기준으로 객체 찾기,
var obj=document .getElementById('mySelect');
//옵션 추가
obj.add(new Option("text","value")) //이것은 IE에서만 유효합니다
obj.options.add(new Option("text","value")); //IE 및 Firefox와 호환됩니다
}

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

//모든 옵션 제거 옵션
function RemoveAll()
{
var obj=document.getElementById(' mySelect');
obj.options.length=0;
}

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

//옵션 옵션 제거
function RemoveOne()
{
var obj=document.getElementById( 'mySelect');// index, 옵션의 일련 번호를 삭제하려면 여기에서 현재 선택된 옵션의 일련 번호를 가져옵니다.
var index=obj.selectedIndex
obj.options.remove( index)
}


코드 복사 코드는 다음과 같습니다.
//옵션 텍스트 가져오기
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex; //일련번호, 현재 선택한 옵션의 일련번호 가져오기
var val = obj.options[index].text;


코드 복사 코드는 다음과 같습니다.
//옵션 옵션 수정
var obj=document.getElementById ('mySelect');
var index=obj.selectedIndex; //일련번호 가져오기 현재 선택된 옵션의 번호
var val = obj.options[index]=new Option("new text","new value ")

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