DEMO：

Question

你能看看这个演示，让我知道它为什么不起作用

＆＃13;

  function changeColor(item){
   var item =  $(this);
   item.css("color", "green");
 }

$(".changer").on("click", function(){
     $('p').changeColor();
});

＆＃13;

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

＆＃13;

Answer 1

您需要将changeColor定义为 jQuery插件而不是简单的功能。

 $.fn.changeColor=function(){

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

然后，不再需要item参数，因为您可以通过this访问jQuery中的target元素;

__

DEMO：

$.fn.changeColor=function(){
           this.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>'

Answer 2

你正在调用函数changeColor，好像它是一个jQuery插件，但它只是一个简单的javascript函数。

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

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

请参阅演示https://jsbin.com/cisujixiru/edit?js,output

调用针对DOM的自定义方法的问题

2 个答案:

DEMO：