JavaScript는 선택 항목에서 공유된 모든 옵션 코드를 삭제합니다.

小云云
풀어 주다: 2018-02-06 09:18:12
원래의
2601명이 탐색했습니다.

이 글은 선택 항목의 모든 옵션 인스턴스를 삭제하는 자바스크립트 관련 정보를 주로 소개합니다. 이 글이 그러한 기능을 깨닫는 데 도움이 되기를 바랍니다.

javascript 선택 항목의 모든 옵션 인스턴스 삭제

방법 1:


function DeleteOptions() 
  { 
    var obj = document.getElementsByTagName("select")[0]; 
    var selectOptions = obj.options; 
    var optionLength = selectOptions.length; 
    for(var i=0;i <optionLength;i++) 
    { 
      obj.removeChild(selectOptions[0]); 
    } 
  }
로그인 후 복사

방법 2: (그런 다음 오른쪽의 모든 옵션을 왼쪽으로 이동 선택)


function MoveAllRightBtn(){ 
    var columnlength=$(&#39;queryColumn&#39;).length; 
    var TempText; 
    var TempValue; 
    for(var i=0;i<columnlength;i++){ 
      TempText=$(&#39;queryColumn&#39;).options[i].text; 
      TempValue=$(&#39;queryColumn&#39;).options[i].value; 
      $(&#39;queryColumn&#39;).remove(i); 
      $(&#39;SearchqqueryColumn&#39;).options.add(new Option(TempText,TempValue)); 
    } 
  }
로그인 후 복사

위의 두 가지 방법 모두 충분하지 않습니다! 한꺼번에 삭제할 수는 없고, 한개라도 삭제하면 옵션에 있는 $('queryColumn') 의 일련번호가 변경되기 때문이죠!
좋은 방법은:


$(&#39;SearchqqueryColumn&#39;).options.length = 0;
로그인 후 복사

또는:


<script> 
function clearOption() 
{ 
  document.getElementById("testSelect").options.length = 0; 
} 
</script>
로그인 후 복사

(그러면 오른쪽 선택의 모든 옵션이 왼쪽 선택으로 이동됩니다) 구현은 다음과 같습니다:


function MoveAllRightBtn(){ 
    var columnlength=$(&#39;queryColumn&#39;).options.length; 
    var TempText; 
    var TempValue; 
    for(var i=0;i<columnlength;i++){ 
      TempText=$(&#39;queryColumn&#39;).options[i].text; 
      TempValue=$(&#39;queryColumn&#39;).options[i].value; 
      $(&#39;SearchqqueryColumn&#39;).options.add(new Option(TempText,TempValue)); 
    } 
    $(&#39;queryColumn&#39;).options.length = 0; 
  }
로그인 후 복사

관련 추천 :

jQuery는 선택 항목을 동적으로 추가 및 삭제합니다

jQuery는 선택 항목을 동적으로 추가 및 삭제합니다(구현 코드)

select_form 특수 효과에서 중복 항목을 삭제하는 js용 구현 코드

위 내용은 JavaScript는 선택 항목에서 공유된 모든 옵션 코드를 삭제합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿