Ausgabe auf Aufrufen einer benutzerdefinierten Methode Targeting DOM

Question

Können Sie bitte einen Blick auf dieses Beispiel nehmen und lassen Sie mich wissen, warum es nicht

function changeColor(item){ 
 
    var item = $(this); 
 
    item.css("color", "green"); 
 
} 
 

 
$(".changer").on("click", function(){ 
 
    $('p').changeColor(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p >Name</p> 
 
<button class="btn btn-default changer" type="submit">Changer</button>'

arbeitet

Answer 1

Sie müssen changeColor als jQuery definieren Plugin nicht so einfache Funktion.

$.fn.changeColor=function(){ 

     this.css("color", "green"); 
} 

Dann keine Notwendigkeit mehr für item Argument, da Sie Element in jQuery über this Ziel zugreifen können;

__

DEMO:

Answer 2

Sie rufen die Funktion changeColor, als ob es ein jQuery-Plugin, aber es ist nur ein einfaches Javascript funciton.

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

$(".changer").on("click", function(){ 
    $('p').changeColor(); 
}); 

Siehe Demo https://jsbin.com/cisujixiru/edit?js,output