Blur is only for form Controls. For span, div, li, and so on, they cannot be triggered. This article provides an example, to see how it is implemented, read the following events (from w3c) first ).
Blur event: a blur event occurs when the element loses focus.
Focus event: the focus () method is used to assign a focus event to the text domain (also to give some elements a focus event ).
TabIndex attribute: The tabIndex attribute can be set or the return button's tab key control order.
We all know that blur only targets form controls. For span, p, li, and so on, they cannot be triggered, now we only need to set a tabindex attribute to trigger their focus events.
Real project code:
The Code is as follows:
Esc. PopupMenu. prototype. _ createPopup = function (){
Var popupDiv = $ ('
'); // Create p
PopupDiv. appendTo (this. _ owner. element); // Add p to span
Var _ popup = popupDiv [0];
_ Popup. hide = function (){
PopupDiv. hide ();
},
_ Popup. show = function (){
PopupDiv. show ();
PopupDiv. focus (); // get p focus
};
PopupDiv. blur (function (){
PopupDiv. hide ();
});
Return _ popup;
}
This Code indicates that I use p to simulate a createPopup (IE can be directly generated). When it is generated, A tabindex attribute is provided, and span is added to it to support display and hiding. It is particularly worth noting that popupDiv, focus (), must give p a focus, otherwise it does not have how to lose the focus.