javascript select text on mouseover

Discussion in 'Javascript' started by trpost@gmail.com, Feb 6, 2007.

  1. Guest

    I want to be able to select a word when I highlight over any part of
    the word. When I say select the word, I want it to be highlighted as
    if I left clicked my mouse and dragged the cursor along the word. I
    want to do this so a user when putting the mouse over the word can
    quickly hit <ctrl>c to copy the word, without having to manually
    highlight the word.

    This will be used multiple times in the script for specific words, not
    for every word in the script. For example:

    User Password
    ------- ---------------
    admin adminUser
    dba sysDbAPa$$

    So in my above example when mousing over either of the passwords, the
    entire password would be highlighted so I can quickly copy it.
    , Feb 6, 2007
    #1
    1. Advertising

  2. Guest

    On Feb 6, 3:09 pm, wrote:
    > I want to be able to select a word when I highlight over any part of
    > the word. When I say select the word, I want it to be highlighted as
    > if I left clicked my mouse and dragged the cursor along the word. I
    > want to do this so a user when putting the mouse over the word can
    > quickly hit <ctrl>c to copy the word, without having to manually
    > highlight the word.
    >
    > This will be used multiple times in the script for specific words, not
    > for every word in the script. For example:
    >
    > User Password
    > ------- ---------------
    > admin adminUser
    > dba sysDbAPa$$
    >
    > So in my above example when mousing over either of the passwords, the
    > entire password would be highlighted so I can quickly copy it.


    Anyone??? Is this even possible, or has anyone seen this done in the
    past?
    , Feb 8, 2007
    #2
    1. Advertising

  3. pcx99 Guest

    wrote:
    > On Feb 6, 3:09 pm, wrote:
    >> I want to be able to select a word when I highlight over any part of
    >> the word. When I say select the word, I want it to be highlighted as
    >> if I left clicked my mouse and dragged the cursor along the word. I
    >> want to do this so a user when putting the mouse over the word can
    >> quickly hit <ctrl>c to copy the word, without having to manually
    >> highlight the word.
    >>
    >> This will be used multiple times in the script for specific words, not
    >> for every word in the script. For example:
    >>
    >> User Password
    >> ------- ---------------
    >> admin adminUser
    >> dba sysDbAPa$$
    >>
    >> So in my above example when mousing over either of the passwords, the
    >> entire password would be highlighted so I can quickly copy it.

    >
    > Anyone??? Is this even possible, or has anyone seen this done in the
    > past?
    >



    It's possible. Your problem is that it's hideously complex and so
    doesn't fall into a category that will get an easy answer on the newsgroup.

    To give you a starting point here is a script written by Martin Honnen
    which will select the contents of any HTML element you pass it. Sample
    usage is this..

    <pre onClick="selectNode(this)">
    blah blah blah
    </pre>

    When you click on the <pre> element it will be selected for easy
    clipping into the clipboard.

    function selectNode (node) {
    //This is a third party function written by Martin Honnen
    //In comp.lang.javascript

    //http://groups-beta.google.com/group/comp.lang.javascript/browse_thread/thread/2b389e61c7b951f2/99b5f1bee9922c39?lnk=gst&q=(doc+%3D+node.ownerDocument)+%26%26+(win+%3D+doc.defaultView)&rnum=1&hl=en#99b5f1bee9922c39
    var selection, range, doc, win;
    if ((doc = node.ownerDocument) && (win = doc.defaultView) && typeof
    win.getSelection != 'undefined' && typeof doc.createRange != 'undefined'
    && (selection = window.getSelection()) && typeof
    selection.removeAllRanges != 'undefined') {
    range = doc.createRange();
    range.selectNode(node);
    selection.removeAllRanges();
    selection.addRange(range);
    } else if (document.body && typeof document.body.createTextRange !=
    'undefined' && (range = document.body.createTextRange())) {
    range.moveToElementText(node);
    range.select();
    }
    }

    That should at least get you started if you want to pursue it from there.

    --
    http://www.hunlock.com -- Musings in Javascript, CSS.
    $FA
    pcx99, Feb 8, 2007
    #3
  4. Guest

    Thanks! That helped me! Here is how I ended up using it:

    <span onmouseover="selectNode(this)";
    OnMouseOut="clearSelection(this);">blah</span><br>
    <span onmouseover="selectNode(this)";
    OnMouseOut="clearSelection(this);">blah1</span><br>
    <span onmouseover="selectNode(this)";
    OnMouseOut="clearSelection(this);">blah2</span><br>
    <span onmouseover="selectNode(this)";
    OnMouseOut="clearSelection(this);">blah3</span><br>

    <script language=javascript>
    function selectNode (node)
    {
    var selection, range, doc, win;

    if ((doc = node.ownerDocument) && (win = doc.defaultView) && typeof
    win.getSelection != 'undefined' && typeof doc.createRange !=
    'undefined' && (selection = window.getSelection()) && typeof
    selection.removeAllRanges != 'undefined')
    {
    range = doc.createRange();
    range.selectNode(node);
    selection.removeAllRanges();
    selection.addRange(range);
    }
    else if (document.body && typeof document.body.createTextRange !=
    'undefined' && (range = document.body.createTextRange()))
    {
    range.moveToElementText(node);
    range.select();
    }

    }


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


    </script>

    So I created an additional function to clear the selection on
    OnMouseOut and am using <span> tags as the <pre> tags added an extra
    space highlighted at the end of the word, where span does not.
    , Feb 9, 2007
    #4
    1. Advertising

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

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Morten
    Replies:
    2
    Views:
    685
    Morten
    Dec 19, 2003
  2. Tony
    Replies:
    3
    Views:
    88,279
    Richard
    Jan 17, 2004
  3. Ed Jay
    Replies:
    30
    Views:
    1,347
    Jonathan N. Little
    Aug 25, 2005
  4. palmiere
    Replies:
    1
    Views:
    382
    Erwin Moller
    Feb 9, 2004
  5. Kurda Yon
    Replies:
    0
    Views:
    108
    Kurda Yon
    Jan 20, 2009
Loading...

Share This Page