ansaurus

Question

Answer 1

A:

This will do the trick:

  jQuery("#element").click(function () {
       jQuery('#elementcontainer').load('/js/jquery.script.js');
       jQuery('#elementcontainer').load('/js/jquery.script2.js');
       jQuery(this).unbind('click');
    });

Note the unbind() method called on $(this) (which is the element #element). You can check more unbind() functionality here.

Bogdan Constantinescu 2010-07-14 12:23:19

Answer 2

+5 A:

You can use one() like this:

jQuery("#element").one('click', function () {
   jQuery('#elementcontainer').load('/js/jquery.script.js?' + (new Date().getTime()));
   jQuery('#elementcontainer').load('/js/jquery.script2.js?"' + (new Date().getTime()));
});

.one() executes the event handler exactly once, the Date() piece is for the cache. I'm no sure you want .load() though, if your intent is just to get/execute the scripts, then $.getScript() is more appropriate, like this:

jQuery("#element").one('click', function () {
   jQuery.getScript('/js/jquery.script.js');
   jQuery.getScript('/js/jquery.script2.js');
});

$.ajax() requests of dataType = "script" (which $.getScript() is) won't be cached.

If you want to cache, you have two options, you can use $.ajaxSetup() once (but this affects all subsequent $.ajax() or shorthand calls):

$.ajaxSetup({ cache: false });

Or make the full $.ajax() call version that $.getScript() is short for:

jQuery("#element").one('click', function () {
   jQuery.ajax({ url: '/js/jquery.script.js', dataType: 'json', cache: true });
   jQuery.ajax({ url: '/js/jquery.script2.js', dataType: 'json', cache: true });
});

Nick Craver 2010-07-14 12:23:27

ok cool thx so much ill give this a try now :) can I just replace the .load with .getscript ? also I want the scripts to cache. current they add the ?_=2312312312 but I don't want them too ?

Tom 2010-07-14 12:27:30

@Tom - Yup, I added an example...if you look at your console, getscript will add the time to the querystring under the covers, it happens here: http://github.com/jquery/jquery/blob/master/src/ajax.js#L269

Nick Craver 2010-07-14 12:30:12

@Tom - They need to add that...that's *how* they instruct the browser not to cache, otherwise IE in particular will hold onto them.

Nick Craver 2010-07-14 12:30:47

@Nick Craver: +1 for that caching thing, noobs run into problems as they don't know requests being cached in those cases.

Sarfraz 2010-07-14 12:30:55

hey thanks so much nick - if I want to cache the scripts ? can I do this with the above code ? i.e. currently the ?=2312312 is added but I would prefer they were cached ?

Tom 2010-07-14 12:31:12

@Tom - I *completely* misread that, you *want* to cache, one moment.

Nick Craver 2010-07-14 12:31:44

I like the idea of examples of cached and not, gives flexibility.

Mark Schultheiss 2010-07-14 12:35:10

ah ok great thx. the only problem I thougt is I would have to use EncodeString() or something like this :)

Tom 2010-07-14 12:36:13

@Tom - I added how to fetch them *without* that timestamp for caching as well :)

Nick Craver 2010-07-14 12:38:23

legend! thx so much :)

Tom 2010-07-14 12:55:13

ansaurus

tags:

views:

answers:

jQuery Load Script Once onClick

related questions