Javascript将文本转换为链接

我试图让用户在文本框中输入文本时将其打印为可点击的链接。这里是我的代码：Javascript将文本转换为链接

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; 
}

链接被显示，您可以点击但是它只是打开了相同的页面，不走到用户输入的内容。

任何帮助将非常感激。

来源

2016-03-04 Big T

只需更改代码这一点。你必须为每个链接形成一个“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>

来源

2016-03-04 06:21:14

嘿，谢谢。有用！ –

嘿，抱歉打扰你了。刚刚意识到链接不会在target = blank的新选项卡中打开。而且我不确定把它放在JS的哪个位置，这样做的确如此。你有什么主意吗？ –

@BigT我编辑了答案。 –

变化for循环

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

基本上就没有形成锚标记正确

来源

2016-03-04 05:58:24 gurvinder372

Javascript将文本转换为链接

回答

相关问题