Jquery addClass() не работает с event.target

Пожалуйста, помогите.

Почему jquery addClass() не работает с event.target? Я сделал код, и он должен добавить класс в цель при нажатии, но он не работает, и он говорит: e.target.addClass не является функцией.

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>

Ответ 1

В основном e.target будет объектом javascript, вы должны преобразовать его в объект Jquery, прежде чем использовать его функции, такие как .addClass()

Попробуйте,

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

и в то же время $("this").addClass("big"); этот код не будет работать, поскольку вы передаете this в виде строки. this также объект javascript, вам нужно также преобразовать его как объект jquery, например $(this)

Ответ 2

Так как .addClass() - это метод jQuery, вам нужен объект jQuery, поэтому конвертируйте e.target в объект jQuery, обернув его внутри $:

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

Кроме того, другим решением является использование $(this). вам не нужно обертывать this внутри " ":

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

Обновлено Fiddle

Ответ 3

У вас есть проблема две:

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

Ответ 4

Измените эту строку

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

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

И если вам это нужно с самим event, вы можете использовать

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

Ответ 5

Попробуйте следующее:

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

Демо

Ответ 6

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

</script>

"this" = > this

Ответ 7

    e.currentTarget.classList.add("loading_arrow");

Вы можете использовать строку выше, чтобы добавить класс loading_arrow, используя событие мыши js.