Suggested Videos
Part 32 - jQuery to detect which mouse button clicked
Part 33 - Binding event handlers in jquery
Part 34 - Binding event handlers using jquery on method
In this video we will discuss how to pass data to the event handler function in jQuery
The following example,
1. Binds the click event handler to the button using on function
2. We are passing 3 arguments to the on() function
a) The name of the event
b) JSON object that contains data that we want to pass to the event handler
c) Event handler method name
3. In the event handler method (sayHello), we access the data using event object's data property.
Output :
Hello John Doe
Hello Mary
No name provided
Part 32 - jQuery to detect which mouse button clicked
Part 33 - Binding event handlers in jquery
Part 34 - Binding event handlers using jquery on method
In this video we will discuss how to pass data to the event handler function in jQuery
The following example,
1. Binds the click event handler to the button using on function
2. We are passing 3 arguments to the on() function
a) The name of the event
b) JSON object that contains data that we want to pass to the event handler
c) Event handler method name
3. In the event handler method (sayHello), we access the data using event object's data property.
<html>
<head>
<title></title>
<script src="jquery-1.11.2.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#btnClickMe').on('click', {
firstName: 'John',
lastName: 'Doe'
}, sayHello);
$('#btnClickMe').on('click', {
firstName: 'Mary'
}, sayHello);
$('#btnClickMe').on('click', sayHello);
function sayHello(event) {
if
(event.data == null) {
alert('No name provided');
}
else {
alert('Hello ' +
event.data.firstName +
(event.data.lastName !=
null ? ' ' + event.data.lastName : ''));
}
}
});
</script>
</head>
<body style="font-family:Arial">
<input id="btnClickMe" type="button" value="Click Me" />
</body>
</html>
Output :
Hello John Doe
Hello Mary
No name provided
No comments:
Post a Comment
It would be great if you can help share these free resources