<body>
<div id= "Demo" ></div>
<button id= "BTN" >trigger it</button>
<script type= "Text/javascript" >
(function ($) {
Demo1
$ ("#demo"). Bind ("Demo-trigger", function (e, args) {
var info = [];
We get the data from the args parameter.
For (Var prop in args) {
Info.push (prop + ":" + Args[prop]);
}
this.innerhtml = Info.join (';');
});
$ (' #btn '). Click (function () {
We passed the data as a parameter to the trigger method with the event name we care about.
$ (' #demo '). Trigger (' Demo-trigger '), {
Name: ' Andrew ',
Age: ' 23 ',
Job: ' Frontend Dev '
});
});
/**demo2
$ ("#demo"). Bind ("Demo-trigger", function (e) {
var info = [];
We get our incoming data through the incoming E.extra.
For (Var prop in E.extra) {
Info.push (prop + ":" + E.extra[prop]);
}
Show it.
this.innerhtml = Info.join (';');
});
$ (' #btn '). Click (function () {
This is a very interesting usage. We new a jquery event object parameter for our concern
var event = new Jquery.event ("Demo-trigger");
Attach an attribute to this event that contains our data
Event.extra = {
Name: ' Andrew ',
Age: ' 23 ',
Job: ' Frontend Dev '
};
Finally, the event passed into the trigger method ... Look at the $ (' #demo ') above.
$ (' #demo '). Trigger (event);
});**/
}) (JQuery);
</script>
</body>
