Triggering events when clicking away from a focused Select2 -


I need to capture an event on that object (such as a click) that is elsewhere on that page and a The child does not have the Select2 object, while the select2 object is the focus and the result is showing. When select2 result object is focused, I can not click anywhere on a button / anchor on the page and its implementation is done. It only closes the select2 object.

Is there any way to do this? Here's a demo that shows this behavior:

  & lt ;! - Javascript snippet - & gt; $ (Document) .ready (function () {$ ("# e1"). Select2 (); $ ("# e2") Click (function () {alert ("click!"); E.preventDefault () ;});}); & Lt ;! - HTML snippet - & gt; & Lt; Select ID = "E1" & gt; & Lt; / Select & gt; & Lt; A href = "#" id = "e2" & gt; When Selection 2 is focused & lt; / A & gt; Using select2 v3.5.2 and jQuery 1.11.0   

Select2 has a "mask" element behind the drop down that captures the mouse click. about this.

Here is the one that shows the mask element.


You can try to remove the mask element when the dropdown is opened.

ex> $ ('# e1'). Select2 () ('Select2-open', function ($ {'select2-drop-mask'). Remove ();}); Of course, this means that the drop-down will not stop when the user closes it, but you can add an event handler to the document (or body) to do so. / P>

  $ (document). Click (function () {$ ("# e1"). Select2 ('close');});  

You must ensure that click events on the second element do not promote the document in that case.

  $ ('# e2'). Click (function () {warning ('click!'); Return false; // stop default action and stop promotions.});  


Comments

Popular posts from this blog

python - Overriding the save method in Django ModelForm -

html - CSS autoheight, but fit content to height of div -

qt - How to prevent QAudioInput from automatically boosting the master volume to 100%? -