javascript - Prevent loss of element focus (Need cross-browser solution) -

javascript - Prevent loss of element focus (Need cross-browser solution) -

i'm using next solution prevent loss of focus of #content textarea when user has clicked on .box element:

// observe latest element clicked $(document).mousedown(function(e) { lastelclicked = $(e.target); }); // prevent loss of focus textarea when clicking on tools $("#content").on("blur", function(event) { if (lastelclicked.attr('class') == 'box'){ event.preventdefault(); this.focus(); homecoming false; } });

in few words, on mouse downwards save target element has been clicked. on blur of #content textarea check if lastly element clicked .box. if prevent default, refocus #content textarea , homecoming false.

my solution works perfect under chrome still loose focus under safari , firefox. how can create work cross browser?

edit:

the problem solutions offered element looses focus , refocused after. in chrome code above never loose fucus, means selected text stays selected.

edited:

try this:

// observe latest element clicked $(document).mousedown(function(e) { window.lastelclicked = $(e.target); }); // prevent loss of focus textarea when clicking on tools $("#content").on("blur", function(event) { if (window.lastelclicked.attr('class') == 'box'){ event.preventdefault(); var that=this; settimeout(function(){ $(that).trigger('focus'); },200); window.lastelclicked=""; homecoming false; } });

also nice article on bug appears on safari's part: http://bugs.jquery.com/ticket/7768

alternatively seek one:

$('.box').click(function(event){ event.preventdefault(); $('input').each(function(){ $(this).trigger('blur'); }); settimeout(function(){ $('#content').trigger('focus'); },200); });

finally have mention still loses focus on highlighted text seems me impossible task accomplish in case!

javascript jquery