"display:none" content copied to clipboard, visible when pasted
I'm having a problem with non-displayed HTML elements being copied to the clipboard, and then displayed when the content is pasted into MS Word, Outlook, etc.
For example:
<p>Hello</p>
<p style="display: none;">I'm Hidden</p>
<p>World</p>
If I view that HTML in a browser, copy the text to my clipboard, then paste into Outlook, the middle paragraph remains hidden. Good news.
However, in this example:
<p>Hello</p>
<input type="text" value="I'm not hidden" style="display: none;" />
<p>World</p>
If I do the same - copy to clipboard, paste into Outlook - the text input is visible.
Is there any way I can supress this? (Without resorting to telling users to select "Keep text only" in Outlook.)
Thanks!
Answer
Use type='hidden' instead of type='text' for the input box and wrap this inside a div with style set to display: none