>  기사  >  웹 프론트엔드  >  HTML의 선택 옵션을 숨길 수 없는 문제를 완벽하게 해결합니다.

HTML의 선택 옵션을 숨길 수 없는 문제를 완벽하게 해결합니다.

高洛峰
高洛峰원래의
2017-02-15 14:07:557158검색

개발 과정에서 우연히 이 문제를 접하게 되었는데, 이 문제를 최초로 해결한 것이 바이두였습니다. 결과는 다음과 같습니다.

1. 옵션 없음을 먼저 설정하는 방법은 절대 불가능합니다.
2. 한 네티즌이 제안한 두 가지 방법:
a. 비활성화된="비활성화" 속성을 추가하면 해당 옵션을 선택할 수 없게 되지만 숨기지 않습니다.
b 숨기려는 경우 DOM 트리에서만 옵션을 제거할 수 있습니다. 그런 다음 옵션을 삭제합니다. 옵션이 캐시된 다음 옵션이 표시될 때 캐시에서 꺼내어 DOM 트리에 추가됩니다.
확실히 요구 사항에 부합하지 않습니다.
c. 궁극적인 해결책(모든 브라우저와 호환되도록 테스트됨): 옵션에 상위 태그를 추가하고 [여기서 스팬 태그가 사용됨]을 숨기도록 설정합니다. 상위 태그입니다.

그러나 위의 방법은 소용이 없습니다

최종 해결 방법:

//将select通过clone方法保存
var select= $("#select").clone();

//删除所有的option
$("#select").find('option').remove();

//查找出需要显示的option并复制
var options = select.find("option[value=1]").clone();

//将需要显示的option添加到select中
$("#select").append(options);

//因为option.remove()不会刷新控件,需要将新的option切换上去
//这里排除了options.size() == 0的情况
$("#select").find('option').eq(0).attr("selected",true);

그렇습니다.

HTML의 선택 옵션을 숨길 수 없는 문제에 대한 더 완벽한 솔루션입니다. 관련 기사는 PHP 중국어 홈페이지를 주목해주세요!

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