CODEWITHSUNDEEP
javascripthtmlcss
Tamás
Tamás

Reputation: 1112

Controlling "select all" behaviour

While I'm writing to a textarea, text input or working in an iframe, "select all" only selects the text what's inside them.
I need to reach this kind of behaviour with a div (using CSS or JavaScript).

In a nutshell:

I shouldn't be selected on select all.
<div id="box">
I should be selected on select all.
</div>

I'm working on a custom confirmation box in JavaScript and it would be weird if I click "select all" in the context menu or press Ctrl + A and select everything on the page: simplified fiddle.

Upvotes: 0

Views: 141

Answers (2)

user6245342
user6245342

Reputation: 108

Not quite sure exactly what you're asking but here are two things that may help...

This CSS will stop users from highlighting things that shouldn't be highlighetd on a page...

* {
 -webkit-user-select: none;
 -webkit-tap-highlight-color: transparent;
}

And this javascript will enable a user to highlight and copy an item when he clicks on it...

onclick="this.focus(); this.select();"

NB: Webkit only CSS provided here as I only work in Chromium.

Upvotes: 0

callback
callback

Reputation: 4122

You can add a class to the area you dont want it to be selected and use css like this like this: 

.no_select { 
 -webkit-touch-callout: none;
 -webkit-user-select: none;
 -khtml-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
}

See it in fiddle

Upvotes: 2

Related Questions