Cách gọi hàm trong plugin jquery?

Question

(function($) { 
    $.fn.top_islides = function(){ 
     var ajax_init = function(){ 
      init_islides(); 
      setTimeout(function(){picmove()},300); 
     }; 
//..... 
    }; 
})(jQuery); 

gọi nó trong doucument sẵn sàng trong một tập tin

$('#top_slides').top_islides(); 
$('#top_slides').top_islides().ajax_init(); 

Tôi nghĩ rằng nó sẽ làm việc, tôi đã nhận ra lỗi, vấn đề là những gì?

Answer 1

Làm điều đó như thế này:

(function($) { 
    //Assuming $.fn.top_islides is defined 
    $.fn.top_islides.ajax_init = function(){ 
     init_islides(); 
     setTimeout(picmove,300); 
    }; 
//..... 
})(jQuery); 

Hoặc

(function($) { 
    $.fn.top_islides = function(){ 
     var ajax_init = function(){ 
      init_islides(); 
      setTimeout(picmove,300); 
     }; 
     return { 
      ajax_init: ajax_init 
     }; 
    }); 
    //..... 
})(jQuery); 

Answer 2

Hãy thử một cái gì đó như thế này như trong ví dụ dưới đây: -

<script type="text/javascript"> 


    $.someplugin = { 
     CallMe : function() { 
      alert("You called?"); 
     }, 
     otherstuff : function() { alert("other stuff!"); } 
    }; 


    $.someplugin.CallMe(); 
    $.someplugin.otherstuff(); 
</script> 

Answer 3

khi sử dụng var bên trong một hàm, nó sẽ làm cho phần tử "riêng tư". đó là một cách hacky để làm cho khả năng hiển thị trong công việc Javascript, trong khi cấu trúc lớp thực sự không đến với Javascript. Bạn cần phải hoặc đặt nó là nguyên mẫu của hàm của bạn hoặc để trả lại một đối tượng

(function($) { 
    $.fn.top_islides = function(){ 
    var ajax_init = function(){ 
     init_islides(); 
     setTimeout(function(){picmove()},300); 
    }; 
    return { 
     'ajax_init': ajax_init 
    }; 
    //..... 
    }; 
})(jQuery); 

hoặc

(function($) { 
    $.fn.top_islides = function(){ 
    //..... 
    }; 
    $.fn.top_islides.prototype.ajax_init = function(){ 
    init_islides(); 
    setTimeout(function(){picmove()},300); 
    } 
})(jQuery); 

nhưng trong trường hợp của bạn, bạn sẽ không thể sử dụng nguyên mẫu, kể từ khi bạn aren' t instantiating một đối tượng mới top_islides, nhưng truy cập thông qua jQuery, vì vậy tùy chọn đầu tiên là đặt cược tốt nhất của bạn.

Answer 4

Imo, giải pháp tốt nhất được sử dụng trình kích hoạt sạch hơn vì bạn có thể giữ hệ thống plugin có thể kết nối.

Bạn có thể tuyên bố xử lý sự kiện trong khai plugin của bạn và kích hoạt từ bên ngoài:

(function($) { 
    $.fn.top_islides = function(){ 
    this.on ('init_islides', function(){ 
     setTimeout(function(){picmove()},300); 
    }; 
    //..... 
    }; 
})(jQuery); 
$("button").click(function() { 
    $("p").trigger("init_islides"); 
}); 

DOC có thể được tìm thấy ở đây: http://api.jquery.com/on/