Вызов определяемой пользователем функции для объекта jQuery

Question

Я хочу, чтобы цвет текста менялся при нажатии на него. Вот код, который я сейчас использую:

$(document).ready(function() {
    $("#colorChanger p").click(function() {
        $(this).changeColor();
    });

    function changeColor() {
        $(this).css("color", "white");
    };
})

У меня также есть этот код на JSFiddle . Что не так с моим кодом?

Answer 1

Обновлена ​​скрипка: http://jsfiddle.net/xME2L/5/

Если вы хотите добавить функцию, чтобы вы могли вызывать ее для всего, что возвращается из $ (), вы должны использовать:

$.fn.functionName = function() {}

Answer 2

Вы должны определить changeColor как плагин JQuery, если вы хотите назвать его как $ (this) .changeColor (); :

$(document).ready(function(){            
    $("#colorChanger p").click(function(){
        $(this).changeColor();
    });

    $.fn.changeColor = function() {
      this.css("color","white");
    };

})

Answer 3

В качестве альтернативы решения agmcleod , вы можете позвонить changeColor таким образом (без изменения changeColor):

changeColor.call(this);

Демонстрация изменений здесь .

Answer 4

Функция changecolor никогда не была назначена объекту jquery el.

Альтернативой решению agmcleod будет:

$(document).ready(function(){

        $("#colorChanger p").click(function(){
           changeColor($(this));
         });

        function changeColor(el){
            el.css("color","white");
        };
});

http://jsfiddle.net/dq6yv/

Answer 5

Вот мое решение . Вы неправильно передали объект в функцию changeColor. Я также рекомендовал бы объявлять changeColor вне функции document.ready.