JavaScript delegates (Delegate) blur and focus usage examples Analysis _javascript skills

This example describes the JavaScript delegate (Delegate) Blur and focus usage. Share to everyone for your reference. The specific analysis is as follows:

Opera (9.5b) for all focus and blur events, can not be correctly triggered two times;
Therefore, the processing functions of the focus and blur events can be delegated to the capture phase of the event.

Example 1 (List Class):

Copy Code code as follows:

<ol id= "List" >
<li><a href= "#" > List Items 1</a>
<ol>
<li><a href= "#" > List Items 1.1</a></li>
<li><a href= "#" > List Items 1.2</a></li>
<li><a href= "#" > List Items 1.3</a></li>
</ol>
</li>
Other list items
</ol>

Example 2 (Form Class):

Copy Code code as follows:

<form id= "Form" >
<input type= "text" id= "textbox"/>
Other table Items
</form>

Here we are listening to the outermost ol block, if we use blur and focus events, just for this whole ol, then inside the control of the focus and Blur events how to deal with it?

The processing method is as follows:

IE Processing:

Copy Code code as follows:

$ (' list '). onmouseover = Handlemouseover;
$ (' list '). onmouseout = Handlemouseout;
$ (' list '). Onfocusin = Handlemouseover;
$ (' list '). Onfocusout = Handlemouseout;

It can also be written in the following form:

Copy Code code as follows:

$ (' list '). attachevent (' Onfocusout ', handlemouseout,true);

If you want to pass an argument, you can add an intermediate function, such as

Copy Code code as follows:

$ (' list '). attachevent (' Onfocusout ', function (event, myparams) {handlemouseout (event, myparams);},true);

FF Processing:

Copy Code code as follows:

$ (' list '). AddEventListener (' Focus ', handlemouseover,true);
$ (' list '). AddEventListener (' Blur ', handlemouseout,true);

I hope this article will help you with your JavaScript programming.