HOME       >>       Websites and Web Designing

Google Chrome Onfocus='this.select()' Problem


I'm having a slight problem with Google Chrome.
I have a fairly straight forward form with only a single text field. When this field gains focus, all text should be selected which should work with the following code:

<form method='get' action='/cms/search.php' style='margin-right: 10px; margin-bottom: -10px' name='searchform'> <input class='tbox search' type='text' name='q' size='20' value='Zoeken' onFocus='this.select()' /> <input type='hidden' name='r' value='0' /><input class='button search' type='hidden' name='s' value='Zoeken' /> <input type='hidden' name='t' value='all' /> <input type='hidden' name='adv' value='0' /> </form>

In Google Chrome however, the field gets selected and then deselected immediatly and it's almost impossible to select the text in that field.

I've searched the web, but didn't find any solution . Is there anybody else who had this problem and knows how to fix it ?


Safari on windows has the same problem


SolutionGoogle Chrome Onfocus='this.select()' Problem

We can avoid whatever is happening in webkit browsers as soon as the focus event handler is finished by forking our text selection using setTimeout:

$("input[name=myInput]").Focus(function () {

 setTimeout('$("input[name=myInput]").Select()', 10);


Good luck.

- Corey


Xisto.com offers Free Web Hosting to its Members for their participation in this Community. We moderate all content posted here but we cannot warrant full correctness of all content. While using this site, you agree to have read and accepted our terms of use, cookie and privacy policy. Copyright 2001-2019 by Xisto Corporation. All Rights Reserved.