By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,852 Members | 955 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,852 IT Pros & Developers. It's quick & easy.

Prevent text selection after double click

P: n/a
Hi.

We're using the dblclick event in some parts of a web app interface,
which works okay, but when a user double clicks on a text element, the
browser selects some text before executing the event handler. How can
I prevent this behaviour?

TIA,
nase

Apr 20 '07 #1
Share this Question
Share on Google+
6 Replies


P: n/a
"Fnord Nase" <fn*******@gmail.comwrote in message
news:11**********************@l77g2000hsb.googlegr oups.com...
Hi.

We're using the dblclick event in some parts of a web app interface,
which works okay, but when a user double clicks on a text element, the
browser selects some text before executing the event handler. How can
I prevent this behaviour?
I do not suppose you could tighten up the double click event to a particular element?

Say maybe make it fire only on buttons?

Otherwise, I do not believe it is possible to fire an event with a disabled FORM element.
Otherwise I would not know how to go about not highlighting when double clicking.

-Lost
Apr 20 '07 #2

P: n/a
On Apr 20, 5:06 pm, "-Lost" <missed-s...@comcast.netwrote:
Otherwise, I do not believe it is possible to fire an event with a disabled FORM element.
Otherwise I would not know how to go about not highlighting when double clicking.
Oh, I wasn't talking about form elements. Sorry, I should been more
precise. The element that receives the dblclick event is a <div>
containing a few words (like "showing rows 11,024 to 11,090 of
129,776").

I guess my question is: is it possible to unselect text?
We had a similar situation previously, in a drag&drop context, and
IIRC we had to resort to using a hidden <inputfield and to select()
its contents, but this is really just an ugly hack...

cheers,
nase

Apr 20 '07 #3

P: n/a
Fnord Nase wrote:
I guess my question is: is it possible to unselect text?
Yes you can, using Ranges and clearing the selection. See below (tested
IE7, FF2 and Opera 9).

---
<div ondblclick="clearSelection()">Hello, world!</div>
<script type="text/javascript">
function clearSelection() {
var sel ;
if(document.selection && document.selection.empty){
document.selection.empty() ;
} else if(window.getSelection) {
sel=window.getSelection();
if(sel && sel.removeAllRanges)
sel.removeAllRanges() ;
}
}
</script>
---

<URL:http://msdn.microsoft.com/workshop/author/dhtml/reference/objects/obj_textrange.asp>
<URL:http://www.w3.org/TR/2000/REC-DOM-Level-2-Traversal-Range-20001113/ranges.html>

Note that IE supports an onselectstart attribute; defining
onselectstart="return false" prevents any selection on the element.
However, you do not seem to want to prevent the selection in every case,
only when you have your double click behavior, so it might not be
appropriate to use it (after all, the user may legitimately want to
select some part of the element, for copy-pasting).
HTH,
Elegie.
Apr 20 '07 #4

P: n/a
On Apr 20, 8:21 pm, Elegie <ele...@invalid.comwrote:
function clearSelection() {
var sel ;
if(document.selection && document.selection.empty){
document.selection.empty() ;
} else if(window.getSelection) {
sel=window.getSelection();
if(sel && sel.removeAllRanges)
sel.removeAllRanges() ;
}}
Thanks a lot, Elegie!
That's exactly what I was trying to do.

cheers,
nase

Apr 20 '07 #5

P: n/a
On Apr 21, 4:21 am, Elegie <ele...@invalid.comwrote:
Fnord Nase wrote:
I guess my question is: is it possible to unselect text?

Yes you can, using Ranges and clearing the selection. See below (tested
IE7, FF2 and Opera 9).

---
<div ondblclick="clearSelection()">Hello, world!</div>
<script type="text/javascript">
function clearSelection() {
var sel ;
if(document.selection && document.selection.empty){
document.selection.empty() ;
} else if(window.getSelection) {
sel=window.getSelection();
if(sel && sel.removeAllRanges)
sel.removeAllRanges() ;
window.selection is DOM 0 and therefore not well documented. Removing
all ranges from a selection object may not necessarily remove all
selections, it doesn't in Safari at least. It might be better to use
the collapse method:

sel.collapse() ;

<URL: http://developer.mozilla.org/en/docs/DOM:Selection >
--
Rob

Apr 21 '07 #6

P: n/a
RobG wrote:

Hello Rob,
window.selection is DOM 0 and therefore not well documented. Removing
all ranges from a selection object may not necessarily remove all
selections, it doesn't in Safari at least. It might be better to use
the collapse method:

sel.collapse() ;

<URL: http://developer.mozilla.org/en/docs/DOM:Selection >
Quite interesting. I wasn't aware of this collapse method on the
selection, to me the selection object would originally be different
different from a range object (which is why it offered methods to grab
and manipulate ranges from the selection, like removeAllRanges,
rangeCount, getRangeAt).

Thanks for the tip!

Regards,
Elegie.
Apr 21 '07 #7

This discussion thread is closed

Replies have been disabled for this discussion.