>  기사  >  웹 프론트엔드  >  jquery 선택기: 숨김과 [type=hidden]의 차이점

jquery 선택기: 숨김과 [type=hidden]의 차이점

黄舟
黄舟원래의
2017-06-23 11:42:511814검색

selector:hidden에 대한 설명과 관련하여 jquery 문서에는 다음과 같이 나와 있습니다. 모든 보이지 않는 요소 또는 숨겨진 유형의 요소를 일치시킵니다. 그리고 [type=hidden]은 typeattribute이 Hidden인 모든 요소를 ​​찾는 것입니다. 둘 사이에는 유사점과 차이점이 있습니다. :hidden은 모든 보이지 않는 요소 또는 숨겨진 유형의 요소와 일치합니다. display 스타일이 없음이고 유형이 "hidden"인 양식 요소는 검색 결과에 있지만 [type=hidden]만 검색됩니다. 유형 속성이 숨겨진 요소를 찾습니다.

그래서 input:hidden은 텍스트 상자, 라디오, 체크박스, 버튼 등 보이지 않는 컨테이너에 있는 입력 요소와 type="hidden"인 양식 요소를 찾는 것입니다. input[type=hidden]은 type="hidden"인 양식 요소만 검색합니다. 다음 예를 들어보세요:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>jquery Demo</title>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript">
function beforeHidden()
{
    $("#result").text("隐藏前:$(\"input:hidden\").length="+$("input:hidden").length+";$(\"input[type=hidden]\").length="+$("input[type=hidden]").length);
}
function afterHidden()
{
    $("#div1").hide();
    $("#result").append("<br/>隐藏后:$(\"input:hidden\").length="+$("input:hidden").length+";$(\"input[type=hidden]\").length="+$("input[type=hidden]").length);
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<div id="div1">
<input type="text"  id="txt" />
<input type="radio" id="rdo" /><label for="rdo">单选框</label>
<input type="checkbox" id="chx"/><label for="chx">复选框</label>
<br />
<input type="button" id="btn1" value="原始" onclick="beforeHidden();"/>
</div>
<input type="hidden" id="hd"/>
<input type="button" id="btn2" value="隐藏后" onclick="afterHidden();"/>
<div id="result"></div></form>
</body>
</html>

예제에서 div1이 숨겨지기 전, $("input:hidden").length=1;$("input[type=hidden]").length=1, 숨긴 후, 뒤에 숨기기: $("input:hidden").length=5;$("input[type=hidden]").length=1, 분명히

div1中的<input type="text"  id="txt" />
<input type="radio" id="rdo" />
<input type="checkbox" id="chx"/>
<input type="button" id="btn1" value="原始"/>

도 포함되며 $("input[type=hidden] ").length는 변경되지 않습니다.

위 내용은 jquery 선택기: 숨김과 [type=hidden]의 차이점의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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