表單輸入作為url參數，並在網頁上輸出新的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>

其余代碼不包括在內。 現在，這是我想在網頁上獲得的內容：

基因信息： 基因卡

（< 'A HREF = “http://www.genecards.org/cgi-bin/carddisp.pl?gene= ABI2”> Genecards）加入'顯示的代碼。

到目前為止，我已經在堆棧中找到了這個……：

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