Yeah, Copy/paste gets ya no where for sure.
For each() you should check out: http://docs.jquery.com/Core/each Which states: "Execute a function within the context of every matched element" >From my previous example, "this.each()" is the same as saying: $('#divNameHere').each(); So that runs your plugin only within that element. So this: $('#nav a', obj).click(function(){ $('#someDiv').fadeIn(); }) Is also this in each instance: $('#divNameHere #nav a').click(function(){ $('#someDiv').fadeIn(); }) So it's changing out what '#divNameHere' is depending on what elements you are applying your plugin to. Hopefully that helps answer your question. If you're not already. Use Firefox with Firebug and put something like console.log('this is: ', this); in your plugin within the this.each() funciton. Firebug then will log what this is in each instance. And FYI console.log will give you a JS error in IE so comment it out before testing in IE. On Apr 7, 2:58 pm, Spot <s...@napalmriot.com> wrote: > Nathan, first off, thank you for responding. > > I understand about passing the obj as scope. That makes perfect sense. > However I am a little confused as to the purpose of returning this.each. > What is the goal there? > > I find it better to understand why something works, as opposed to just > copy/pasting. It saves everyone time in the long run. :) > > Thanks again! > > > > Nathan wrote: > > > To do this you need to have "return this.each" and optionally change > > the instance of "this" which is the name of the object you are apply > > the plugin to, to "obj" using "var obj = $(this);". > > > Then when you call a selector, you'll need to add "$('#nav a', obj)" > > note the ", obj". > > > This will keep it within the name space of what ever selector you > > apply this to when the plugin is initialize. > > > (function($){ > > $.fn.extend({ > > plauginNameHere: function() { > > return this.each(function() { > > var obj = $(this); // this just changes the use > > of 'this' to obj > > > $('#nav a', obj).click(function(){ > > $('#someDiv').fadeIn(); > > }); > > > }) > > } > > }); > > })(jQuery); > > > On the page level you will then need to initialize the plugin on the > > HTML page level. > > > <script type="text/javascript" charset="utf-8"> > > $(function(){ > > $('#divNameHere'). plauginNameHere(); // first instance > > $('#secondDivNameHere'). plauginNameHere(); // second instance > > }); > > </script> > > > So what ever the selector name is above, for example > > "#secondDivNameHere", will then be the 'this' that we changed to 'obj' > > using a var in plugin script. So in this example the plugin's "obj" is > > "#secondDivNameHere". > > > Let me know if that helps. > > > On Apr 6, 1:44 pm, Spot <s...@napalmriot.com> wrote: > > >> How would one develop a plugin which can exist multiple times on the > >> same page, without conflicting with each others namespaces?
