Question

I’m trying to add a HTML link to an input box using the following jQuery:

var E = "<a class='tagged_person' contenteditable='false' href='http://www.google.com'>Click This</a>";
$("input[name='newComment']").val(E);

Which is working, but its literally displaying the <a href..., which is what I wanted backend wise, but on the frontend, I’d like the user to see it as rendered as a HTML <a> link. Just like on Facebook/Twitter you can tag users and then there’s a link.

Answer 1

You can use the following code, which when select it will open the link in a new window.

<form action="../">
<select name="myDestination">
    <option value="http://www.website1.com/">Website 1</option>
    <option value="http://www.google.com/">GOOGLE</option>
</select>
<input type="button"
    value="Open in New Window!"
    onclick="ob=this.form.myDestination;window.open(ob.options[ob.selectedIndex].value)">
</form>

Or without the need to press a button:

<form action="../">
  <select onchange="window.open(this.options[this.selectedIndex].value,'_top')">
    <option value="">Choose a destination...</option>
    <option value="http://www.website1.com/">Website 1</option>
    <option value="http://www.google.com/">GOOGLE</option>
  </select>
</form>

Also created a jsfiddle to demonstrate: jsFiddle