Prevent Stop Block certain HTML Tag from being Copied e.g. URL <a> tag

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • sploxon
    New Member
    • Dec 2017
    • 1
    #1

    Prevent Stop Block certain HTML Tag from being Copied e.g. URL <a> tag

    i want to make it so that when a user copies an image from a website and pastes this image in, say, their email client, the <a> tag URL which surrounds the image tag is not copied along with the image.

    This was brought to my attention by a colleague who copied images from the website into Outlook which retained the URL somehow. As she did not want the URL to be sent to the recipient, only the image. I told her she could simply right click -> remove hyperlink but she didn't want to have to do this, And one could easily forget to.

    The fix in my mind -> would be to have something in the html prevent the <a> tag from being copied when the user right clicks to copy image. Does anybody understand what I am trying to say? I can't really think of an analogy that would be relevant.
    Tags: None
    • gits
      Recognized Expert Moderator Expert
      • May 2007
      • 5390
      #2
      well - this is a pretty strange requirement - since you can only do something that you can control - so only on websites where you have access to the code. there is something like this:

      Element: copy event - Web APIs | MDN
      https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/oncopy
      The copy event of the Clipboard API fires when the user initiates a copy action through the browser's user interface.


      and take note of something like that as well:

      Events - cut, copy, paste
      https://www.quirksmode.org/dom/events/cutcopypaste.html


      but i suggest to not use it - it alters the normal behaviour of the browser displaying a webpage that a user might expect - so may be one of your colleages wants to copy all while another one doesnt. fiddling around with standard behaviours on a website often leads to annoyance for users. usually the receiving app has to take care of what should be pasted to it - and it does already. since the 'remove hyperlink' option already is there. just dont copy the tag and it wouldnt even be there - so whats copied is usually even pasted - thats how it should work and everyone expect that.

      but if you have to for some reason - u can fiddle around with the cut/copy events in this case.

        Comment

        • Dhananjay pande
          New Member
          • Feb 2018
          • 1
          #3
          calculator

          Code:
          <html>
<head>
<title>http://calculator</title>
</head>

<body bgcolor="black" topmargin="100" leftmargin="100">
<table border="100" >
<td>
<table border="6" cellspacing="1" cellspadding="2" bgcolor="orang">
<TD>
<form name="Calc">
<table border="10" cellspacing="2" cellspadding="6">
<th bgcolor="blue">
<table  border="1" width="250" size="80" cellspacing="10" cellspadding="15">
<tr>
<td>
<input type="text" name="Numbers" size="16" />
</td>
</tr>
<tr>
<td>
<input type="button" value="  1  " onClick="document.Calc.Numbers.value += '1'"/>
<input type="button" value="  2  " onClick="document.Calc.Numbers.value += '2'"/>
<input type="button" value="  3  " onClick="document.Calc.Numbers.value += '3'"/>
<input type="button" value="  +  " onClick="document.Calc.Numbers.value += '+'"/>
<br />
<input type="button" value="  4  " onClick="document.Calc.Numbers.value += '4'"/>
<input type="button" value="  5  " onClick="document.Calc.Numbers.value += '5'"/>
<input type="button" value="  6  " onClick="document.Calc.Numbers.value += '6'"/>
<input type="button" value="  -   " onClick="document.Calc.Numbers.value += '-'"/>
<br />
<input type="button" value="  7  " onClick="document.Calc.Numbers.value += '7'"/>
<input type="button" value="  8  " onClick="document.Calc.Numbers.value += '8'"/>
<input type="button" value="  9  " onClick="document.Calc.Numbers.value += '9'"/>
<input type="button" value="  x  " onClick="document.Calc.Numbers.value += '*'"/>
<br />
<input type="button" value=" .    " onclick="document.Calc.Numbers.value +='.'"/>
<input type="button" value="  0  " onClick="document.Calc.Numbers.value += '0'"/>
<input type="button" value="  /  " onClick="document.Calc.Numbers.value  += '/ '"/>
<input type="button" value="  %  " onClick="document.Calc.Numbers.value += '/100'"/>
<input type="button" value="  =  " onClick="document.Calc.Numbers.value = eval(Calc.Numbers.value)"/>
<br />
</td>
</tr>
</table>
<input type="button" value="  AC  " onClick="document.Calc.Numbers.value  = ' '"/>

</th>
</table>
</form>
<h1>Enjoye <i><samp style="color: blue;" margin="10">calculator</samp></i></h1>
<marquee><h3>Develop by Dhananjay pandey</h3></marquee>
</TD>
</table>
</td>
</table>
</body>
</html>
          Last edited by gits; Feb 26 '18, 06:35 PM. Reason: added code tags

            Comment

            • Frinavale
              Recognized Expert Expert
              • Oct 2006
              • 9749
              #4
              If you really want to do this, you could try removing the <a> tags around the images and use JavaScript to hook up onClick Events for the images that would do what the <a> tag would have done.

              (This assumes that you own the website and can edit the HTML/JavaScript that you are talking about. This cannot be applied to websites that you do not own/control/maintain)
              Last edited by Frinavale; Feb 22 '18, 04:43 PM.

                Comment

                Previous template Next
                Working...