> 웹 프론트엔드 > JS 튜토리얼 > jquery 클릭 이벤트가 실패하면 어떻게 해야 할까요?

jquery 클릭 이벤트가 실패하면 어떻게 해야 할까요?

藏色散人
풀어 주다: 2020-11-20 11:48:26
원래의
2008명이 탐색했습니다.

JQUERY1.7 이후에는 라이브가 더 이상 권장되지 않기 때문에 jquery 클릭 이벤트가 실패합니다. 해결 방법은 코드를 "$("#a").on('click',function(){for(var i= 0 ; i< leng;i++){...}}".

jquery 클릭 이벤트가 실패하면 어떻게 해야 할까요?

권장: "jquery 비디오 튜토리얼"

코드

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试</title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
<style type="text/css">
 #a{
     width:50px;
     height:50px;
     background: rgb(54, 54, 54);
 }
 #b{
     width:50px;
     height:50px;
     background: rgb(144, 243, 182);
 }
 #d{
     width:50px;
     height:50px;
     background: rgb(114, 116, 231);
 }
 li{
     list-style: none;
 }
.display{display:block;}
.hide{display:none;}
 </style>
</head>
<body>
    <p id="a"></p>
    <p id="b"></p>
    <p id="d"></p>
    <p id="c">
        <ul>
            <li id="c1">11111111</li>
            <li id="c2">22222222</li>
            <li id="c3">33333333</li>
        </ul>
    </p>
<script type="text/javascript">
    var link = $(&#39;ul li&#39;);
    var leng = c.querySelectorAll("li").length;
    $("#a").on(&#39;click&#39;,function(){
        for(var i=0 ; i< leng;i++){
            link[i].className = &#39;display&#39;
        }
    })
    $("#b").on(&#39;click&#39;,function(){
        for(var i=0 ; i< leng;i++){
            if(link[i].id !== &#39;c2&#39;){
                link[i].className = &#39;hide&#39;
            }else{
                link[i].className = &#39;display&#39;
            }
        }
    })
    $("#d").on(&#39;click&#39;,function(){
        for(var i=0 ; i< leng;i++){
            if(link[i].id !== &#39;c1&#39;){
                link[i].className = &#39;hide&#39;
            }else{
                link[i].className = &#39;display&#39;
            }
        }
    })   
</script>
</body>
</html>
로그인 후 복사

원래 이렇게 작성했지만, 동적 요소 및 속성에 이벤트를 바인딩하기 위해 Live 및 on이 지원되는 것으로 나타났습니다. Now on은 주로 사용되지 않습니다. , on을 사용할 때도 주의하세요. 페이지가 로드될 때 on 이전의 요소도 DOM에 존재해야 합니다. 동적 요소나 스타일은 on

  $(&#39;#a&#39;).click = function(){
      for(var i=0 ; i< leng;i++){
           link[i].className = &#39;display&#39;
      }
  }
로그인 후 복사

Later의 두 번째 매개변수에 배치될 수 있습니다. 다음 코드

 $("#a").on(&#39;click&#39;,function(){
        for(var i=0 ; i< leng;i++){
            link[i].className = &#39;display&#39;
        }
 })
로그인 후 복사

위 내용은 jquery 클릭 이벤트가 실패하면 어떻게 해야 할까요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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