f



Deselecting text in input text box

I have a text input box and I don't want the text to be selected either
when the user tabs to the item or if the user clicks on it.

Now the function below which I found from 2002 in the archive works
fine for IE 6 but it works in neither Netscape 7 nor Firefox 1.0.

I'm hoping some of you might have an alternative suggestion or insight
for Netscape and Firefox.


Code that works in IE6:

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

<input type="text" name="theElt" onfocus="javascript: clearSelection()"
size="12" maxlength="20" readOnly style="margin: 7px 3px 0px 3px;
border: 0px;" />

0
2/27/2006 6:05:46 PM
comp.lang.javascript 38370 articles. 2 followers. javascript4 (1315) is leader. Post Follow

5 Replies
768 Views

Similar Articles

[PageSpeed] 36

len.hartley@gmail.com wrote:
> I have a text input box and I don't want the text to be selected either
> when the user tabs to the item or if the user clicks on it.
>
> Now the function below which I found from 2002 in the archive works
> fine for IE 6 but it works in neither Netscape 7 nor Firefox 1.0.
>
> I'm hoping some of you might have an alternative suggestion or insight
> for Netscape and Firefox.

There was an old exploit by clearing value and by setting it again. I
have no time to check if it's still ticking, sorry:

var fld = document.forms['myForm'].elements['myField'];
var tmp = fld.value;
fld.value = '';
fld.value = tmp;

0
VK
2/27/2006 9:25:59 PM
len.hartley@gmail.com wrote:
> I have a text input box and I don't want the text to be selected either
> when the user tabs to the item or if the user clicks on it.

What are you trying to achieve?

It is impossible to reliably prevent either of the above using script. 
Making the element readonly will prevent the user from changing the 
value using normal keyboard input.  Making the element disabled will 
knobble it even further, but neither will reliably stop the user from 
selecting it or copying the value that's in there.


> Now the function below which I found from 2002 in the archive works
> fine for IE 6 but it works in neither Netscape 7 nor Firefox 1.0.

It 'works' in IE only in a limited way.  Once I've clicked on the input, 
  or tabbed to it, I can then select the text in it (tab to it then 
press Ctrl+A).  I can also drag across the input to select it, then copy 
and paste into some other application.

If I turn off scripting, the script fails to do anything at all.


> I'm hoping some of you might have an alternative suggestion or insight
> for Netscape and Firefox.

If you explain what you are trying to achieve, maybe.

[...]


-- 
Rob
0
RobG
2/28/2006 12:00:15 AM
there is one solution, but its not really javascript

here's the code so u get the idea

<div style="width:200px; border:1px solid black; text-align:left">
<div style="width:200px; height:40px; position:relative; top:40px;
background:">&nbsp;</div>
<input type="text" value="value not to be selected" style="width:200px;
height:40px">
</div>

0
kay
2/28/2006 12:43:38 AM
kay wrote:
> there is one solution, but its not really javascript

To what?


> here's the code so u get the idea

Is your shift key broken?


> <div style="width:200px; border:1px solid black; text-align:left">
> <div style="width:200px; height:40px; position:relative; top:40px;
> background:">&nbsp;</div>
> <input type="text" value="value not to be selected" style="width:200px;
> height:40px">
> </div>

Use tab to navigate to the input, the text is selected, Ctrl+A will copy 
it to the clipboard.  Triple-click will select it all, as will clicking 
in the text then dragging over it.  Right-click and choose 'select all'.

How many ways can I defeat thee?  :-x


-- 
Rob
0
RobG
2/28/2006 2:12:15 AM
My Internet connection was down for most of last week so I'm just
getting back to this now.

What am I trying to achieve?

I'm trying to make a data entry field that is difficult (but not
necessarily impossible) to edit.  I have back-end checks for the
same-ass who is determined to override the value and he'll get an
error.

I don't want a user who tabs through (or clicks on) the field to see it
selected and wonder if it is editable, can be changed, etc.  So the
main concern is usuability.

I'm not sure what the functionality of the DIV styles below was.  I
don't think that it's changing the highlight colour.

0
len
3/7/2006 11:10:54 PM
Reply: