Thursday, 19 September 2013

How to wrap the jQuery function

How to wrap the jQuery function

Question
I'd like to know the best way I can wrap the jQuery function while
retaining all functionality. Essentially I want to call $('#someId') but
have it operate as $('#' + id + 'someId') by wrapping the function,
modifying the arguments, and passing it through to the original jQuery
function.
Motivation
I have a section of JS that will reuse the same variable winId which is
concatenated and passed to jQuery. Instead of writing
$('#' + winId + 'someId').html();
$('#' + winId + 'someOtherId').css();
...
$('#' + winId + 'someThirdId').text();
throughout the whole file, I want to wrap the jQuery function so I can
just call
$('#someId').html();
$('#someOtherId').css();
...
$('#someThirdId').text();
and and have winId added in before passing through to $.



My attempt
Here's what I'm thinking as a wrapper:
(function(){
var fn = $;
return $ = function(){
for(var i = 0; i < arguments.length; i++){
if(typeof arguments[i] == 'string'){
arguments[i] = /* code to add in winId, omitted */
}
}
return fn.apply(this, arguments);
}
})();
This works great, except that obviously none of the methods like $.ajax
are available:
Uncaught TypeError: Object function (){
for(var i = 0; i < arguments.length; i++){
if(typeof arguments[i] == 'string'){
arguments[i] = /* code to add in winId, omitted */
}
}
return fn.apply(this, arguments);
} has no method 'ajax'
Note: I know I could copy the object over using jQuery.extend($, jQuery),
but I'm interested in a more elegant solution than that if possible.

No comments:

Post a Comment