Écrire un plugin jquery dans coffeescript - comment obtenir « (fonction ($) » et « (jQuery) »?

Question

Je suis en train d'écrire un plugin jquery dans coffeescript mais je ne suis pas sûr de savoir comment obtenir wrapper partie droite de la fonction.

Mon commence CoffeeScript avec ceci:

$.fn.extend({
    myplugin: ->
        @each ->

Ce qui crée le javascript avec une enveloppe de fonction:

(function() {
  $.fn.extend({
      myplugin: function() {
          return this.each(function() {

mais je veux un '$' passé dans comme ceci:

(function($) {
  $.fn.extend({

Dans le même pour la désinence j'ai ... rien en particulier dans coffeescript.
Je reçois cela en javascript:

})();

Mais voudrait ceci:

})(jQuery);

Quelqu'un sait comment y parvenir avec le compilateur coffeescript? Ou quelle est la meilleure façon de ce faire dans coffeescript?

Answer 1

La réponse est que vous n'avez pas besoin de l'appeler comme ça dans CoffeeScript - votre script est déjà en toute sécurité enveloppé dans une fermeture, donc il n'y a pas besoin de jQuery contournées en as-a-paramètre-tours. Il suffit d'écrire:

$ = jQuery

... en haut de votre script, et vous êtes bon pour aller.

Answer 2

Sauf si vous utilisez le drapeau --bare dans le compilateur, le

$ = jQuery

solution

est le meilleur. Si vous sont , puis avec le nouveau mot-clé do, vous pouvez écrire

do ($ = jQuery) ->
   # plugin code...

créant ainsi le champ d'application désirée, tout en évitant un désordre o » entre parenthèses.

Answer 3

Mise à jour / EDIT: Oui, selon l'explication de Jeremy:

$ = jQuery

$.fn.myPlugin = () ->
  console.log('test fired')

à compiles:

(function() {
  var $;
  $ = jQuery;
  $.fn.myPlugin = function() {
    return console.log('test fired');
  };
}).call(this);

Ce qui fonctionne bien comme un plugin jQuery: $('body').myPlugin();

Original:

D'accord, je pense que je peux obtenir près celui-ci, laissez-moi savoir si ça aide.

(($) ->
  $.fn.extend =
    myplugin: ->
    @each: ->
)(jQuery)

rend dans:

(function() {
  (function($) {
    return $.fn.extend = {
      myplugin: function() {},
      this.each: function() {}
    };
  })(jQuery);
}).call(this);

Answer 4

Le plus simple est d'étendre $. Fn objet

Simple plugin jQuery peut être écrit en CoffeeScript comme suit:

$.extend $.fn,

  disable: ->
    @each ->
      e = $(this)
      e.attr("disabled", "disabled") if e.is("button") or e.is("input")

il compilera à

(function() {
  $.extend($.fn, {
    disable: function() {
      return this.each(function() {
        var e;
        e = $(this);
        if (e.is("button") || e.is("input")) {
          return e.attr("disabled", "disabled");
        }
      });
    }
  });
}).call(this);

Answer 5

Vous devriez jeter un oeil à la version CoffeeScript de jQuery ~ boilerplate https://github.com/zenorocha/jquery-boilerplate/blob/master/jquery.boilerplate.coffee

Answer 6

Bien que ce poste est vieux je l'ai trouvé utile. Voici le code-script café qui fonctionne pour moi.

$ -> 
    $('.my-class').hello()

$.fn.hello=-> 
    @each -> 
        $(@).append $ '<div>Hello</div>'

Remarque :. Vous ne pouvez pas déclarer la variable $, vous pouvez simplement l'utiliser dès la sortie de la boîte

Answer 7

Vous pouvez simplement ajouter la fermeture et le compiler vous-même avec le drapeau de --bare.

coffee -w -c --bare jquery.plugin.coffee

(($) ->
  # some code here
)(jQuery)

Answer 8

Simple et facile

Ceci est tout ce que je devais faire pour ajouter ma propre méthode, cleanFadeIn, sur des objets jQuery. Il renvoie les objets pour enchaînant ainsi:

$.fn.extend
  cleanFadeIn: ->                     # $('.notice').cleanFadeIn
    return $(@).each ->               # returns the objects for easy chaining.
      $(@).slideDown 'slow', ->
        $(@).fadeTo 'slow', 1