Prevent copy of hidden elements

Discussion in 'Javascript' started by Spizzat2, May 7, 2008.

  1. Spizzat2

    Spizzat2 Guest

    I've got a web page with some hidden elements that can be shown
    through various methods. What I'd like is, when the user tries to copy
    the visible stuff on the page, it doesn't copy the hidden stuff in
    between. Is there a simple way to do this? I know I could move the
    whole element using some DOM scripting, but I'd really like to do it
    just using something similar to style.visibility=hidden.

    Any suggestions?

    Here's some basic code to tinker with:

    <html>
    <head>
    <script type="text/Javascript">
    var step = 0;
    function test(elem){
    elem = document.getElementById(elem);
    if(step == 0){
    elem.style.visibility = "visible";
    document.getElementById("replace").innerHTML = "visibility:visible,
    display:'' &nbsp;";
    step = 1;
    }else if(step == 1){
    elem.style.display = "";
    document.getElementById("replace").innerHTML = "visibility:hidden;
    display:'' &nbsp;";
    step = 2;
    }else if(step == 2){
    elem.style.visibility = "hidden";
    document.getElementById("replace").innerHTML = "visibility:hidden;
    display:none";
    step = 3;
    }else{
    elem.style.display = "none";
    document.getElementById("replace").innerHTML = "visibility:visible;
    display:none";
    step = 0;
    }
    }
    </script>

    </head>
    <body>
    Highlight the whole page (Ctrl + A), and paste it into notepad to see
    under which conditions the second row shows up.
    <table border="1">
    <tr><td onclick="test('dktk')">Click here to make it <span
    id="replace">visibility:visible, display:none</span></td></tr>
    <tr><td id="dktk" style="display:none; visibility:hidden;">HHHHHH</
    td></tr>
    <tr><td>There are 2 rows above here</td></tr>
    </body>
    </html>
     
    Spizzat2, May 7, 2008
    #1
    1. Advertising

  2. Spizzat2 wrote:

    > I've got a web page with some hidden elements that can be shown
    > through various methods. What I'd like is, when the user tries to copy
    > the visible stuff on the page, it doesn't copy the hidden stuff in
    > between. Is there a simple way to do this? I know I could move the
    > whole element using some DOM scripting, but I'd really like to do it
    > just using something similar to style.visibility=hidden.
    >
    > Any suggestions?
    >
    > Here's some basic code to tinker with:
    >
    > <html>
    > <head>
    > <script type="text/Javascript">
    > var step = 0;
    > function test(elem){
    > elem = document.getElementById(elem);
    > if(step == 0){
    > elem.style.visibility = "visible";
    > document.getElementById("replace").innerHTML = "visibility:visible,
    > display:'' &nbsp;";
    > step = 1;
    > }else if(step == 1){
    > elem.style.display = "";
    > document.getElementById("replace").innerHTML = "visibility:hidden;
    > display:'' &nbsp;";
    > step = 2;
    > }else if(step == 2){
    > elem.style.visibility = "hidden";
    > document.getElementById("replace").innerHTML = "visibility:hidden;
    > display:none";
    > step = 3;
    > }else{
    > elem.style.display = "none";
    > document.getElementById("replace").innerHTML = "visibility:visible;
    > display:none";
    > step = 0;
    > }}
    >
    > </script>
    >
    > </head>
    > <body>
    > Highlight the whole page (Ctrl + A), and paste it into notepad to see
    > under which conditions the second row shows up.
    > <table border="1">
    > <tr><td onclick="test('dktk')">Click here to make it <span
    > id="replace">visibility:visible, display:none</span></td></tr>
    > <tr><td id="dktk" style="display:none; visibility:hidden;">HHHHHH</
    > td></tr>
    > <tr><td>There are 2 rows above here</td></tr>
    > </body>
    > </html>


    I believe it's not possible without DOM/innerHTML/etc. techniques (and
    actually I can't think of a good reason why you would be interested in
    this).

    http://www.w3schools.com/css/pr_class_display.asp
    http://www.w3schools.com/CSS/pr_class_visibility.asp

    --
    Bart
     
    Bart Van der Donck, May 8, 2008
    #2
    1. Advertising

  3. Spizzat2

    Spizzat2 Guest

    The reason is that there's a lot of information associated with the
    rows on the page, so I don't want it all displayed all the time, and
    there's a good chance of the user copying/pasting multiple rows into
    an email, and the users don't want all the extra information showing
    up in the email.

    Thanks for the response, though. I figured I'd have to do it the hard
    way if I was going that direction.

    On May 8, 2:40 am, Bart Van der Donck <> wrote:
    > Spizzat2 wrote:
    > > I've got a web page with some hidden elements that can be shown
    > > through various methods. What I'd like is, when the user tries to copy
    > > the visible stuff on the page, it doesn't copy the hidden stuff in
    > > between. Is there a simple way to do this? I know I could move the
    > > whole element using some DOM scripting, but I'd really like to do it
    > > just using something similar to style.visibility=hidden.

    >
    > > Any suggestions?

    >
    > > Here's some basic code to tinker with:

    >
    > > <html>
    > > <head>
    > > <script type="text/Javascript">
    > > var step = 0;
    > > function test(elem){
    > > elem = document.getElementById(elem);
    > > if(step == 0){
    > > elem.style.visibility = "visible";
    > > document.getElementById("replace").innerHTML = "visibility:visible,
    > > display:'' &nbsp;";
    > > step = 1;
    > > }else if(step == 1){
    > > elem.style.display = "";
    > > document.getElementById("replace").innerHTML = "visibility:hidden;
    > > display:'' &nbsp;";
    > > step = 2;
    > > }else if(step == 2){
    > > elem.style.visibility = "hidden";
    > > document.getElementById("replace").innerHTML = "visibility:hidden;
    > > display:none";
    > > step = 3;
    > > }else{
    > > elem.style.display = "none";
    > > document.getElementById("replace").innerHTML = "visibility:visible;
    > > display:none";
    > > step = 0;
    > > }}

    >
    > > </script>

    >
    > > </head>
    > > <body>
    > > Highlight the whole page (Ctrl + A), and paste it into notepad to see
    > > under which conditions the second row shows up.
    > > <table border="1">
    > > <tr><td onclick="test('dktk')">Click here to make it <span
    > > id="replace">visibility:visible, display:none</span></td></tr>
    > > <tr><td id="dktk" style="display:none; visibility:hidden;">HHHHHH</
    > > td></tr>
    > > <tr><td>There are 2 rows above here</td></tr>
    > > </body>
    > > </html>

    >
    > I believe it's not possible without DOM/innerHTML/etc. techniques (and
    > actually I can't think of a good reason why you would be interested in
    > this).
    >
    > http://www.w3schools.com/css/pr_cla...www.w3schools.com/CSS/pr_class_visibility.asp
    >
    > --
    > Bart
     
    Spizzat2, May 8, 2008
    #3
    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. Alex
    Replies:
    2
    Views:
    1,235
  2. Replies:
    3
    Views:
    728
  3. Replies:
    26
    Views:
    2,120
    Roland Pibinger
    Sep 1, 2006
  4. Rick
    Replies:
    3
    Views:
    8,197
    Alexey Smirnov
    Apr 13, 2010
  5. SolarCanine
    Replies:
    2
    Views:
    290
    SolarCanine
    Sep 20, 2005
Loading...

Share This Page