अनेक कार्यों का

Question

ठीक थोड़े प्लगइन्स के लिए नए मैं अपनी परियोजनाओं में कई का इस्तेमाल किया है हूँ के साथ एक jQuery प्लगइन बनाने मैं भी बुनियादी प्लगइन्स कि सिर्फ विकल्पों के साथ तत्वों पर काम लिखा है:

(function($){ 
    $.fn.pulse = function(options) { 
     // Merge passed options with defaults 
     var opts = jQuery.extend({}, jQuery.fn.pulse.defaults, options); 
     return this.each(function() { 
      obj = $(this);    
      for(var i = 0;i<opts.pulses;i++) { 
       obj.fadeTo(opts.speed,opts.fadeLow).fadeTo(opts.speed,opts.fadeHigh); 
      }; 
      // Reset to normal 
      obj.fadeTo(opts.speed,1); 
     }); 
    }; 
    // Pulse plugin default options 
    jQuery.fn.pulse.defaults = { 
     speed: "slow", 
     pulses: 2, 
     fadeLow: 0.2, 
     fadeHigh: 1 
    }; 
})(jQuery); 

ऊपर ठीक से काम करता है लेकिन स्पष्ट रूप से यह एक कार्य करता है, आदर्श मैं तो मैं इस्तेमाल कर सकते हैं एक प्लगइन के भीतर कई कार्य करने के लिए सक्षम होने के लिए करना चाहते हैं:

$('#div').myplugin.doThis(options); 
$('#div').myplugin.doThat(options; 

कारण किया जा रहा है मैं काफी एक बड़े स्क्रिप्ट जो विभिन्न ajax डेटा को बचाने के लिए कॉल करता है और डेटाबेस से क्वेरी डेटा (बाहरी PHP फ़ाइल का उपयोग करके) मैं चाहता हूं कि मैं चाहता हूं इस कार्यक्षमता को प्लगइन में विभाजित करें, लेकिन मुझे इसके लिए उपयोग करने के लिए सबसे अच्छी संरचना नहीं पता है, आईव ने इतने सारे ट्यूटोरियल देखे हैं और मूल रूप से मेरे मस्तिष्क को तले हुए हैं, और मैं उलझन में हूं कि मुझे ऐसा करने के बारे में कैसे जाना चाहिए।

$.fn.pluginname.dothis = function(options){ 
     return this.each(function() { 
      //execute code 
     }; 
    }; 

इस पर किसी भी संकेत दिए गए हैं, या मुझे मिल वास्तव में मददगार होगा शुरू करने के लिए एक टेम्पलेट:

ऐसा एक नया कार्य बनाने का सवाल है।

हमेशा मदद की ज़रूरत है !!!

---

अगले समस्या:

(function($){ 
// Can use $ without fear of conflicts 
    //var gmap3plugin = $.fn.gmap3plugin; 
    var obj = this; // "this" is the jQuery object 

    var methods = { 
     init : function(options){ 
      var lat = $.fn.gmap3plugin.defaults[lat]; 
      var lng = $.fn.gmap3plugin.defaults[lng]; 
      alert('init'+' lat:'+lat+' --- lng:'+lng); 
     }, 
     show : function() { }, 
     hide : function() { }, 
     update : function(content) { } 
    }; 



    $.fn.gmap3plugin = function(method){ 
     // Method calling logic 
     if (methods[method]) { 
     return methods[ method ].apply(this, Array.prototype.slice.call(arguments, 1)); 
     } else if (typeof method === 'object' || ! method) { 
     return methods.init.apply(this, arguments); 
     } else { 
      $.error('Method ' + method + ' does not exist on jQuery.tooltip'); 
     }; 
    }; 
    $.fn.gmap3plugin.defaults = { 
     mapdiv :'#mapdiv', 
     region : 'uk', 
     lat : 53.4807125, 
     lng : -2.2343765 
    }; 
})(jQuery); 

इस कार्य कर रहा है और हो जाता है है सही समारोह है कि पारित कर दिया है, लेकिन मैं कैसे $ .fn.gmap3plugin.defaults में कोड में मान का उपयोग करते हैं मेरी init विधि रिटर्न अक्षां और एलएनजी

init : function(options){ 
    var lat = $.fn.gmap3plugin.defaults[lat]; 
    var lng = $.fn.gmap3plugin.defaults[lng]; 
    alert('init'+' lat:'+lat+' --- lng:'+lng); 
}, 

के लिए अपरिभाषित या मैं एक समारोह से $ .fn.gmap3plugin.defaults में thhe डेटा का उपयोग नहीं कर सकते हैं ???

Answer 1

यदि आप कुछ अन्य jQuery प्लगइन्स और jQuery UI के डिज़ाइन को देखते हैं, तो वे क्या करते हैं कि उनके पास एक ही फ़ंक्शन $('#div').myplugin({options}) है, और फिर वे ऑब्जेक्ट $('#div').myplugin('performdifferenttask') ऑब्जेक्ट की बजाय स्ट्रिंग पास करके अलग-अलग फ़ंक्शन कर सकते हैं बदले में उपयोगकर्ता से छिपी हुई एक सहायक कार्य को कॉल करें। प्रयोग में फिर

(function($) { 
    $.fn.myplugin = function(options) { 
     if(options == 'function1') 
      function1(); 
     else if(options == 'function2') 
      function2(); 
     else { 
      //do default action 
     } 
    } 

    function function1() { 
     //do something 
    } 

    function function2() { 
     //do something else 
    } 
} 

:

एक उदाहरण के लिए http://jqueryui.com/demos/progressbar/#methods

यहाँ पर देखने के लिए एक उदाहरण है कि उम्मीद है कि अपने भ्रम की स्थिति को कम करेगा

$.myplugin({option1: 4, option2: 6}); //does default behavior 
$.myplugin('function1'); //calls function1() 
$.myplugin('function2'); //calls function2() 

Answer 2

शमूएल के जवाब के बाद, आप भी कर सकते हैं फ़ंक्शन नामों को डबल हैंडलिंग से बचने के लिए निम्न का उपयोग करें:

(function($) { 
    $.fn.myplugin = function(options, param) { 
     if(typeof(this[options]) === 'function') { 
      this[options](param); 
     } 
     // do default action 

     this.function1 = function() { 
      //do something 
     } 

     this.function2 = function(param) { 
      //do something else (with a parameter) 
     } 
    }  
} 

param चर के अलावा आप नीचे दिए गए जैसे कार्यों कॉल करने के लिए अनुमति देता है:

$.myplugin(); // does default behaviour 
$.myplugin('function1'); // run function 1 
$.myplugin('function2'); // run function 2 
$.myplugin('function2',{ option1 : 4, option2 : 6 }); // run function 2 with a parameter object 

एक डेमो के लिए http://jsfiddle.net/tonytlwu/ke41mccd/ देखें।