Calling jQuery method from onClick attribute in HTML
- by Russell
I am relatively new to implementing JQuery throughout an entire system, and I am enjoying the opportunity.
I have come across one issue I would love to find the correct resolve for.
Here is a simple case example of what I want to do:
I have a button on a page, and on the click event I want to call a jquery function I have defined.
Here is the code I have used to define my method (Page.js):
(function($) {
$.fn.MessageBox = function(msg) {
alert(msg);
};
});
And here is my HTML page:
<HTML>
<head>
<script type="text/javascript" src="C:\Sandpit\jQueryTest\jquery-1.3.2.js"></script>
<script language="javascript" src="Page.js"></script>
</head>
<body>
<div class="Title">Welcome!</div>
<input type="button" value="ahaha" onclick="$().MessageBox('msg');" />
</body>
</HTML>
(The above code displays the button, but clicking does nothing.)
I am aware I could add the click event in the document ready event, however it seems more maintainable to put events in the HTML element instead. However I have not found a way to do this.
Is there a way to call a jquery function on a button element (or any input element)? Or is there a better way to do this?
Thanks
