web-dev-qa-db-fra.com

jquery addClass () ne fonctionne pas avec event.target

S'il vous plaît aider.

Pourquoi jquery addClass() ne fonctionne-t-il pas avec event.target? J'ai créé un code censé ajouter une classe à la cible lorsque l'utilisateur clique dessus, mais cela ne fonctionne pas et indique que e.target.addClass n'est pas une fonction.

http://jsfiddle.net/Lq9G4/

CODE:

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Class Test</title>
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <style>
        .big {
            font-size: 5em;
        }
        .small {
            font-size: 1em;
        }
    </style>

</head>
<body>
    <p>This is the text</p>
    <script>
        $(function() {
            $("p").click(function(e) {  
                      $("a").removeClass("big").addClass("small");
                      $("this").addClass("big"); //This doesn't work
                      e.target.addClass("big"); //nor this one                
                    });
        });

    </script>
</body>
</html>
jqueryeventstargetaddclass
14
qtgye

Fondamentalement, e.target sera un objet javascript, vous devez le convertir en un objet Jquery avant d’utiliser ses fonctions telles que .addClass()

Essayer,

$(e.target).addClass("big");

et dans le même temps, $("this").addClass("big");, ce code ne fonctionnera pas puisque vous transmettez this en tant que chaîne. this également un objet javascript, vous devez également le convertir en objet jQuery comme $(this)

29
Rajaprabhu Aravindasamy

Comme .addClass() est une méthode jQuery, vous avez besoin d’un objet jQuery. Pour ce faire, convertissez e.target en objet jQuery en l’enveloppant dans $:

$(e.target).addClass("big");

À côté de cela, l'autre solution consiste à utiliser $(this). vous n'avez pas besoin d'envelopper this dans " ":

$(this).addClass("big");

Mise à jour Fiddle

2
Felix

Vous avez deux problème:

$(this).addClass("big"); //Unquote to "this"
$(e.target).addClass("big"); // select e.target with $() wrapper.
2
Bhojendra Rauniyar

Changer cette ligne

$("this").addClass("big"); //This doesn't work

à

$(this).addClass("big"); //This will work work

Et de plus si vous en avez besoin avec la variable event elle-même, vous pouvez utiliser

$(e.target).addClass('big');
1
Gautam3164

Essaye ça:

 $(e.target).addClass('big');

Démo

0
Milind Anantwar
<script>
    $(function() {
        $("p").click(function(e) {
                  $("a").removeClass("big").addClass("small");
                  $(this).addClass("big"); //This doesn't work               
                });
    });

</script>

"ceci" => ceci 

0
时间只会一直走