Its main meaning is to see if I have used the pre-binding, that is, some elements in the DOM tree are specified when they are not created, and some events of that type should be owned by birth. Pre-binding and post binding are often involved in the actual development process. As the name suggests, pre-binding--not yet born--binds certain events, then binds--some events that are bound after birth.
below, a simple example is presented for your reference and comparison of each method:
Page element:
<div id= "main" >
<a href= "#" > aaaaaaaaaaaaaaaaaaaaaa</a><br/>
<a href= "#" >bbbbbbbbbbbbbbbbbbbb</a><br/>
<a href= "#" >ccccccccccccccccccccccccc</a><br/>
<a href= "#" >dddddddddddddddddddd</a ><br/>
<a href= "#" >eeeeeeeeeeeeeeeeeeeeee</a><br/>
<a href= "#" > fffffffffffffffffffffffffffffffff</a><br/>
<a href= "#" >gggggggggggggggggggg</a>< br/>
<a href= "#" >hhhhhhhhhhhhhhhhhhhh</a>
</div>
<input type= "button" value= " Create a label "id=" Btncreate "/>";
JS on page:
<script src= "201102/scripts/jquery-1.5.js" type= "Text/javascript" ></script>
< Script type= "Text/javascript" >
$ (function () {
//after binding, that is, dynamically created elements cannot have bound events!!!
//1. After binding
//$ ("#main > A"). Click (function () {
//alert ($ (this). html ());
//});
//2. After binding
//$ ("#main > A"). Bind ("click", Function () {
//alert ($ (this). text ());
//});
//3,
//$ ("#main > A"). Bind ({
//click:function () {Alert ($ (this). text ());},
//Mouseov Er:function () {$ (this). CSS ("Background-color", "Red")},
//Mouseout:function () {$ (this). CSS ("Background-color" , "White")}
//});
$ ("#btnCreate"). Bind ({
Click:function () {$ ("<br/><a href= ' # ' > I am a dynamically created </a>"). Appendto ("# Main "); }
});
//4. Pre-binding, dynamically created elements also have clicked Event
//$ ("#main"). Delegate ("A", "click", Function () {
//alert ($ (this). Text ());
//});
//5. Pre-binding, live event source is DocumentdThe source of the elegate is the specific element to bind, so the delegate is more efficient than live.
$ ("#main a"). Live ("Click", Function () {
Alert ($ (this). text ());
});
});
</script>