Deselecting text in input text box

Discussion in 'Javascript' started by len.hartley, Feb 27, 2006.

  1. len.hartley

    len.hartley Guest

    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;" />
     
    len.hartley, Feb 27, 2006
    #1
    1. Advertisements

  2. len.hartley

    VK Guest

    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;
     
    VK, Feb 27, 2006
    #2
    1. Advertisements

  3. len.hartley

    RobG Guest

    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.

    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.

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

    [...]
     
    RobG, Feb 28, 2006
    #3
  4. len.hartley

    kay Guest

    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>
     
    kay, Feb 28, 2006
    #4
  5. len.hartley

    RobG Guest

    To what?

    Is your shift key broken?

    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
     
    RobG, Feb 28, 2006
    #5
  6. len.hartley

    len.hartley Guest

    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.
     
    len.hartley, Mar 7, 2006
    #6
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.