I have input field in HTML with number text which has a dots i.e "1.00.1". If I double click on this field in IE or firefox, browser select only a part of the text (between the dots), but in Chrome double click select the whole text in this field.
What is the best way to change this behavior in Chrome? If I have only text (ie "test.test") in input fields, double click with selection in Chrome works the same like IE and Firefox.
-
This is native browser behaviour and as such can not be changed. You can however fiddle around with javascript to get all the text selected when focusing on a text input. Checkout this answer for detailsgiorgio– giorgio2015-04-09 08:44:39 +00:00Commented Apr 9, 2015 at 8:44
-
This is not related with the code. This is a behavior of the browser. Just go to website which has a input text field (i.e www.google.com) and then please type number with dot (i.e 1.00.1) in input field and then double click on the input. Please do this in 3 browsers (IE, Firefox and chrome) and you can see that Chrome has a different behavior.Michał Matuszek– Michał Matuszek2015-04-09 08:45:02 +00:00Commented Apr 9, 2015 at 8:45
-
@giorgio. I supposed that this is a behavior of the browser, but for me this behavior is very useless. A lot of countries have a date format with dots, so change something with double click selection is horrible. For me behavior in Chrome should be reverse. If I have a number in text field please select my only a part between a dots. If I have a text with dots should be select whole text.Michał Matuszek– Michał Matuszek2015-04-09 08:55:41 +00:00Commented Apr 9, 2015 at 8:55
-
1you can custom yourself double click event to overwrite the default event.Todd Mark– Todd Mark2015-04-09 09:05:14 +00:00Commented Apr 9, 2015 at 9:05
-
You're going through hard ways. Is it really necessary ? I think it should be possible but it's not easy at all, but your question is interesting. You just have to decide if it is really an important feature or not... but if you do it could be usefull for other people ;) have fun with it !Pierre Granger– Pierre Granger2015-04-09 09:11:36 +00:00Commented Apr 9, 2015 at 9:11
|
Show 1 more comment
1 Answer
It should be possible but complex. First you have to detect cursor position on click (first click of the dblclick), store it and use it in dblclick (second click) : Get cursor position (in characters) within a text Input field Here your problem will be to not trigger the click on dblclick, because it will change the cursor position wich is wrong (reset cursor pos to 0). I tried but this is gonna be hard to manage : http://jsfiddle.net/n2rzyxvg/3/
jQuery(document).on('click',"#input",function(){
var clickpos = jQuery(this).getCursorPosition() ;
jQuery(this).data('clickpos',clickpos) ;
console.log("Click ! " + clickpos) ;
});
jQuery(document).on('dblclick',"#input",function(){
console.log("DblClick ! " + jQuery(this).data('clickpos')) ;
});
There is a way but it's not perfert (does not respect the OS behavior of dblclick, it set a custom timeout to imitate dblclick) : Jquery bind double click and single click separately If you can manage to get the cursor position on dblclick, you will then just have to find your first and last character position where you want jQuery to start/stop your selection : Selecting Part of String inside an Input Box with jQuery
I can't help you much more but the difficult part here is the dblclick triggering click, the second part should be easier.
Hope this can help HF
2 Comments
Pierre Granger
really ? But how did you resolved the dblclick problem ? Can you show the fiddle of the solution ?
Michał Matuszek
I will try do this today evening and then I will put the solution :)