形式輸入爲url參數，並在網頁上輸出新的網址

Question

我想讓用戶搜索數據庫中的基因名稱，並在發現後將它們返回到網頁。但是我也希望通過在網頁上創建一個鏈接來提供關於該特定基因的信息，並將基因作爲url參數輸入。

輸入例如：ABI2代碼

<p>Search Gene:</p> 
    <form name = "form1" method="post" action="javascript:jsonfunction();"> 
     <input name="search" type="text" id="search" size="40" maxlength="50"/> 
     <input type="submit" name="Submit" value="Search"/> 
    </form> 

休息不包括在內。 現在，這是我希望得到的網頁：

基因信息： Genecards

（<「A HREF =「http://www.genecards.org/cgi-bin/carddisp .pl？gene = abi2「> Genecards ） added'顯示代碼。

到目前爲止，我發現這堆某處...：

<script> 
function process() 
{ 
var url="http://www.genecards.org/cgi-bin/carddisp.pl?gene=" + document.getElementById("url").value; 
location.href=url; 
return false; 
} 
</script> 

<form onSubmit="return process();"> 
URL: <input type="text" name="url" id="url"> <input type="submit" value="go"> 
</form> 

但這自動重定向到新的一頁。 我只是想把它作爲我的頁面上的鏈接。

在此先感謝:)

Answer 1

我想你想要的是這樣的。基本上這只是一個空的錨標記，並帶有一個ID，以便您可以訪問它，並在提交表單時使用該數據創建指定的鏈接。 （你也可以從無鏈接構建鏈接，但這會更容易）

<script> 
function process() 
{ 
var url="http://www.genecards.org/cgi-bin/carddisp.pl?gene=" + document.getElementById("url").value; 
var link = document.getElementById("geneLink"); 
link.href = url; 
link.text = "Genecards" 
return false; 
} 
</script> 

<form onSubmit="return process();"> 
URL: <input type="text" name="url" id="url"> <input type="submit" value="go"> 
</form> 
<a id="geneLink" href=""></a>