jQuery Plugin Template


/ Published in: Other
Save to your folder(s)



Copy this code and paste it in your HTML
  1. <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
  2. <script type="text/javascript">
  3. (function($){
  4. $.fn.extend({
  5.  
  6. helloWorld : function(options) {
  7. // define some default variables in case none are passed in
  8. var defaults = {
  9. foo: 'hello ',
  10. bar: ' world'
  11. };
  12.  
  13. var options = $.extend(defaults, options);
  14.  
  15. return this.each(function() {
  16. // apply any manipulations to the selected object by simply using the $(this) selector
  17. $(this).html(options.foo+options.bar);
  18.  
  19. });
  20.  
  21. }//,
  22. // if you needed to add more methods (functions) to your plugin, you would uncommment the comma on the line above
  23. // and simply add another function similar to our helloWorld function above.
  24.  
  25. });
  26. })(jQuery);
  27.  
  28.  
  29. $(function(){
  30. $('#test').helloWorld();
  31. //outputs "hello world" #test
  32. $('#test2').helloWorld({foo:'good ', bar:' bye'});
  33. //outputs "good bye" into #test2
  34. });

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.