Prototype into jquery

Question

How does one go about changing an existing prototype function into a jquery one?

ie.

MainWindow = function()
{
 this.activeUser = ""; 
 this.name = "";
}

And the call to bindAll

MainWindow.prototype.bindAll = function() {

Answer 1

You can write a jQuery plugin...

(function($) {
 $.fn.mainWindow = function() {
 ...
 }
})(jQuery);

and then use it like:

$('#thingy').mainWindow();

Answer 2

The common method is to use an anonymous function in the context of jQuery, such as:

// anonymous function that is executed within the jQuery context
// to preserve reference in case of $.noConflict
(function($){
 // $ is now short for jQuery
 // $.fn is short for jQuery.prototype
 // if you want $.myCustomFunction
 $.extend({
 myCustomFunction: function(arg){
 $('#test').append($('<p>').text('myCustomFunction: '+arg));
 }
 });
 // or if you want $('...').myCustomFunction()
 $.fn.extend({
 myCustomFunction: function(arg){
 $.myCustomFunction(arg + ' [from selector]');
 }
 });
})(jQuery);

Demo can be found here: http://jsfiddle.net/bradchristie/Cfsb2/2/

• GregS7: Thanks for the reply. I'm using your suggestion to extend. How would i go about calling the bindAll function. I've tried $.MainWindow = bindAll() but to no avail.
• Brad Christie: @GregS7: assuming bindAll is a method off of MainWindow, $.MainWindow.bindAll()