extend a jQuery Object to my own Object

Question

My problem is the following code! I want extend a jQuery Object to my XjQuery object and i seems to be work. but in the each function where i will find the object the function myfunc is not declared whats wrong here?

cheers and

sorry for my poor english

    XjQuery = function()
    {           
        var jq = $("<div id=xjq>hallo</div>");
        $.extend(this, jq);
    }
    XjQuery.prototype.myfunc = function() {
        this.append("<p>myfunc called</p>");
    }
    xjq = new XjQuery();

    xjq.myfunc(); // this works
    $("#maindiv").append(xjq); // works also 
    $("#maindiv").find("#xjq").each(function() {
        $(this).myfunc(); // doesn't work
    });

gen_Eric · Accepted Answer · 2012-04-20 18:24:50Z

2

Inside the each, this is a native DOM element, and $(this) is a jQuery object. You need to "convert" the jQuery object into your xjQuery object.

Why are you making an xJquery object in the first place? Why not make a jQuery plugin?

jQuery.fn.myfunc = function() {
    this.append("<p>myfunc called</p>");
};

Then you can do $("#maindiv").myfunc().

EDIT: To "cast" a jQuery object as a xjQuery object, you can modify the constructor like this:

XjQuery = function(jq)
{           
    jq = typeof jq === 'undefined' ? $("<div id=xjq>hallo</div>") : $(jq);
    $.extend(this, jq);
}

Then you can do:

$("#maindiv").find("#xjq").each(function() {
    new XjQuery(this).myfunc();
});

edited Apr 20, 2012 at 18:24

answered Apr 20, 2012 at 14:59

gen_Eric

228k42 gold badges304 silver badges343 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

James Andres Over a year ago

Rocket is correct, the right way to add extensions to jQuery is via plugins. These extensions will show up as normal methods on the $ object. For example $('#a-div-id').myPluginMethod(anArgument, anotherArgument)

James Andres Over a year ago

I forgot to mention, jQuery documentation for plugins.

helmi Over a year ago

My extension its just an example i have more different objects that will be extended from jQuery and each object have different member functions

gen_Eric Over a year ago

@helmi: The problem is still that you need to convert from jQuery to your "extended" objects. You can make a function to do that I guess, using $.extend.

helmi Over a year ago

is there a posibility to cast the native object to my extended object

|

Collectives™ on Stack Overflow

extend a jQuery Object to my own Object

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related