Geek asks and answers

How to prevent double-clicking from an “empty” spot in chrome and safari

I have a problem with my page. when the user double-clicks an empty place anywhere (chrome / safari), he simply selects all the empty areas and selects. to avoid this, I used this css property:

body {
  overflow: hidden;
  -moz-user-select     : none;
 -khtml-user-select   : none;
 -webkit-user-select  : none;
 -o-user-select       : none;
 user-select          : none;
}

Now I also can not select the "text". this is very bad. how to make selectable become selectable and avoid empty space ..?

any idea?

Screenshot:

screen shot

Live demo

Note. Click on a table column. You cannot select text.

+3
source share
2 answers

To prevent double-clicking for empty space, you can use below script and force.

function clearSelection() {
    if(document.selection && document.selection.empty) {
        document.selection.empty();
    } else if(window.getSelection) {
        var sel = window.getSelection();
        sel.removeAllRanges();
    }
}

Chrome Safari .

 span.no_selection {    
   -webkit-user-select: none; /*(safari, chrome) webkit */
 }

, .

-1

EDIT: , . . CSS -webkit-user-select: none;, " ". . JSFiddle

-webkit-user-select: none; -. .

, . , , , , , , , . , e.preventDefault . , .

-2

More articles:


All Articles