Que faire si l'événement jquery click échoue-js tutoriel-php.cn

Que faire si l'événement jquery click échoue

藏色散人

Libérer： 2020-11-20 11:48:26

original

1978 Les gens l'ont consulté

L'événement jquery click échoue car live n'est plus recommandé après JQUERY1.7. La solution est de changer le code en "$("#a").on('click',function() {for. (var i=0 ; i< leng;i++){...}}" peut être fait.

Que faire si l'événement jquery click échoue

Recommandé : "Tutoriel vidéo jquery"

Mettez d'abord le code complet

<!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>

Copier après la connexion

Au début, l'événement de clic était écrit comme ceci, mais il a été constaté que le clic n'était pas valide. Live et on sont pris en charge pour lier des événements à des éléments et attributs dynamiques après. JQUERY 1.7.Maintenant, nous utilisons principalement on. Lors de l'utilisation de on, nous devons également faire attention au fait que les éléments précédant on doivent également exister dans le dom lorsque la page est chargée. Les éléments dynamiques ou les styles peuvent être placés dans le deuxième paramètre de on.

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

Copier après la connexion

Plus tard, changez simplement le code par le code suivant

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

Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!