Is there a way that a user can enter a URL in a textarea and have the link actually display and work as a hyperlink?
For example:
<textarea name="Miscell" cols="110" rows="5" wrap="Virtual" class="noborder">
blah blah blah=
<a href="http://www.googel.com/">Google</a>
blah blah blah
</textarea>
No link is displayed: what can I do?
I'm not creating that site: I'm just trying to change it using Firebug.
No, it is not possible(it will not render the UI). If you want to show form fields why are you using textarea ? You can just use normal html.
Complete HTML/CSS Course 2022Use the <textarea> tag to show a text area. The HTML <textarea> tag is used within a form to declare a textarea element - a control that allows the user to input text over multiple rows. Specifies that on page load the text area should automatically get focus.
This is possible with <textarea> . You only need to use the Summernote WYSIWYG editor. It interprets HTML tags inside a textarea (namely <strong> , <i> , <u> , and <a> ).
You can't place any 'Active Link' inside a text area. A text area is designed to displaying text only content. Instead of that you can use div and using some css make div as a text area.
Eg: (Not my code)
<style type="text/css">
#box {
width: 400px;
margin: 0 auto;
overflow: auto;
border: 1px solid #0f0;
padding: 2px;
text-align: justify;
background: transparent;
}
</style>
HTML...
<body>
<div id="box">
<h4>My Links</h4>
<a href=">• Paragraph One Here.</p><p><a href="URL path to external link" title="Mouseover Description">Link Text Description</a></p>
<p><a href="URL path to external link" title="Mouseover Description">Link Text Description</a></p>
<p><a href="URL path to external link" title="Mouseover Description">Link Text Description</a></p>
<p><a href="URL path to external link" title="Mouseover Description">Link Text Description</a></p>
<p><a href="URL path to external link" title="Mouseover Description">Link Text Description</a></p>
</div>
Use a DIV like this :
<div id="box">
<h4>My Links</h4>
<p><a href="URL" title="Description">Text Description</a></p>
<p><a href="URL" title="Description">Text Description</a></p>
</div>
And make sure this script tag comes after this div element
<script type="text/javascript">
document.getElementById("box").contentEditable='true';
</script>
If you are using jQuery it does not matter where u put the script tag, just put it in $(document).ready();
This will make the div editable. And this means the links also will be editable. I tested it out - works in chrome and ff.
This will make the div editable, but you need to give the users some visual cue to tell them that this is editable - Use CSS to make it look like a text area.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With