Javascript конвертировать текст по ссылке

Question

Я пытаюсь сделать так, чтобы пользователь вводил текст в текстовое поле, он печатает его как ссылку, на которую они могут щелкнуть. Вот мой код:

HTML:

<form> 
<input type="text" id="urlhtml" size ="30" placeholder="http://www.sait.ca"> 
<br> 
<br> 
<input type="submit" value="Add Url" id="submit"onclick="getUrlList(); return false"> 
</form> 
<br> 
<h2> Your favorite urls are: </h2> 
<a href target ="_blank" ><h3><span id="showurls"></span> 
</h3></a> 

JAVASCRIPT:

var urlList=[]; 
    function getUrlList() { 

    var url={urlhtml}; 
    var i=0; 
    var thisList=""; 

    url.urlhtml=document.getElementById("urlhtml").value; 

    urlList.push(url); 
     for(i=0; i< urlList.length;i++) 
     { 
     var thisurl={urlhtml}; 
     thisurl=urlList[i]; 
     thisList+="http://" + thisurl.urlhtml; 
     thisList+="<br>"; 

     } 
    document.getElementById("showurls").innerHTML=thisList; 
} 

Ссылка получает отображается, и вы можете нажать на нее, однако это только открывает ту же страницу и не идет к тому, что пользователь вводил.

Любая помощь была бы действительно оценена.

Answer 1

Просто измените код для этого. Вы должны сформировать атрибут «a» для каждой ссылки.

var urlList = []; 
 

 
function getUrlList() { 
 

 
    var url = { 
 
    urlhtml 
 
    }; 
 
    var i = 0; 
 
    var thisList = ""; 
 

 
    url.urlhtml = document.getElementById("urlhtml").value; 
 

 
    urlList.push(url); 
 
    for (i = 0; i < urlList.length; i++) { 
 
    thisList += "<a target='blank' href='http://" + urlList[i].urlhtml + "'>" + urlList[i].urlhtml + "</a><br>"; 
 
    } 
 
    document.getElementById("showurls").innerHTML = thisList; 
 
}

<form> 
 
    <input type="text" id="urlhtml" size="30" placeholder="http://www.sait.ca" value="www.google.com"> 
 
    <br> 
 
    <br> 
 
    <input type="submit" value="Add Url" id="submit" onclick="getUrlList(); return false"> 
 
</form> 
 
<br> 
 
<h2> Your favorite urls are: </h2> 
 
<a href target="_blank"><h3><span id="showurls"></span> 
 
</h3></a>

Answer 2

изменения для цикла в

for(i=0; i< urlList.length;i++) 
{ 
    thisList+="<a href='http://" + urlList[i] + "'>" + urlList[i] + "</a><br>"; 
} 

в основном вы не образующие тегов анкерных правильно