[jQuery] Event handler executes method, without assigning it as a callback
Hey folks!
Just started a few days ago using jQuery and i really learned to love
it! :) While building a little JavaScript formular validation
"framework" i found a strange behavior.
First i add the following function to the prototype of the Object
class, so i can check on EVERY object if it owns a specific method:
Object.prototype.methodExists = function(methodName) { return
(typeof(this[methodName]) == "function"); };
Now i bind a function to the "onfocus" event of the input field "abc".
$(document.forms[0].abc).bind("focus", function(e) { /* event action
*/ });
Until here everything is fine, but when the user sets the focus on the
field "abc" the following is happening:
1. The methodExists function is executed
2. The event function which is bound to the input field "abc" is
executed
And that's veeery strange. I think methodExists function should not be
executed, because i never defined so.
Looking forward for your help :)
Complete code example:
<html>
<head>
<script type="text/javascript">
Object.prototype.methodExists = function(methodName) {
window.defaultStatus+= methodName.target.name +
":methodExists,"; // for debugging
return (typeof(this[methodName]) == "function");
};
</script>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<form action="javascript://">
abc: <input type="text" name="abc" /><br />
xyz: <input type="text" name="xyz" />
</form>
<script type="text/javascript">
$(document.forms[0].abc).bind(
"focus",
function(e) {
window.defaultStatus+= e.target.name + ":" + e.type + ","; // for
debugging
}
);
</script>
</body>
</html>