[jQuery] jQuery.extend and prototype inheritance?
Hi All,
Sorry if this is my second post but I have no idea if my first post
went through.. Plus I have additional info/questions:
So I'm trying to wrap jQuery/DOM elements with custom methods.. I've
looked around and people claim you can use jQuery.extend (the one
documented under utilities not core) and extend a jQuery object using
prototypes.. Now I've been able to do this, it looks like it's not
actually using prototypes but property copies.. Does anyone have any
ideas about this?
The following is some test code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript">
function baseProto(el) {
if(el){
$(el).click(function(e){
this.doSomething();
e.preventDefault();
});
}
};
baseProto.prototype.doSomething = function()
{
alert("DOING SOMETHING FUNCTION:
\n"+this.doSomething);
}
var inherit = new baseProto(null);
function test(){
var answer = baseProto.prototype.isPrototypeOf($
("#a_element").get(0));
alert("Is baseProto a prototype of "+$
("#a_element").get(0).id+"? Answer: "+answer);
var answer =
baseProto.prototype.isPrototypeOf(inherit);
alert("Is baseProto a prototype of inherit
object? Answer: "+answer);
baseProto.doSomething= function(){ alert("DOING
SOMETHING ELSE"); };
};
$.fn.addProto = function(){
return this.each(function(){
jQuery.extend(this, new baseProto(this));
})
};
$(document).ready(function(){
$('a').addProto();
});
</script>
</head>
<body>
<div>
<input name="Check if Prototype" type="button" value="See if
Prototype" onclick="test();" />
</div>
<a id ="a_element" href="http://google.com">DO Something or Something
Else</a>
</div>
</body>
</html>