如何預先填充url參數中的html表單輸入字段？

我有一個香草形式的html頁面。有一項要求是可以通過網址預先填寫表單。就像：如何預先填充url參數中的html表單輸入字段？

http://some.site.com/somePage.html?forename=Bob&surname=Jones

我似乎無法找到任何簡單的解決方案。有人可以用一些JavaScript指向正確的方向來完成這個任務嗎？很高興使用JavaScript解決方案，但我更願意避免僅僅爲了這個單一用途而拉入整個庫（目前沒有使用）。謝謝。

來源

2011-03-24 Chris Knight

使用自定義查詢字符串的Javascript函數。

function querySt(ji) { 

    hu = window.location.search.substring(1); 
    gy = hu.split("&"); 

    for (i=0;i<gy.length;i++) { 
     ft = gy[i].split("="); 
     if (ft[0] == ji) { 
      return ft[1]; 
     } 
    } 
} 
var koko = querySt("koko");

然後將檢索到的值賦給輸入控件;是這樣的：

document.getElementById('mytxt').value = koko;

來源

2011-03-24 16:26:27 Ian

function getUrlVars() 
{ 
    var vars = [], hash; 
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); 

    for(var i = 0; i < hashes.length; i++) 
     { 
     hash = hashes[i].split('='); 
     vars.push(hash[0]); 
     vars[hash[0]] = hash[1]; 
     } 

    return vars; 
} 

var get = getUrlVars(); 

//returns get['forename'] == bob; surname == jones

來源

2011-03-24 16:27:37

謝謝，我喜歡這個簡單的外觀。我的JavaScript有點生疏。你能簡要描述一下''var var = []，hash;''？ – 2011-03-24 18:46:28

這只是在逗號分隔列表中聲明變量。 vars = []實例化一個新的空數組，hash是一個單獨的變量。只是一次宣佈2的簡寫方式。 – 2011-03-24 19:19:57

啊，當然。我錯誤地將''hash'與''[]''關聯起來。 – 2011-03-24 19:41:32

您是否使用PHP？如果是這樣，那會讓事情變得更容易。假設您的鏈接如上所述，您可以使用：

<?php 
$forename = $_GET['forename']; 
$surname = $_GET['surname']; 
?> 
---------- 
<input id='forename' type='text' value='<?php echo $forename; ?>' > 
<input id='surname' type='text' value='<?php echo $surname; ?>' >

這應該爲您預先填充。

來源

2011-03-24 16:28:51 paradox870

爲什麼這會被投票？這是一個有效的問題，因爲這將是最簡單的方法。 – Metropolis 2011-03-24 18:01:00

這不是我誰downvoted，但恐怕我沒有使用PHP。 – 2011-03-24 18:43:39

也許，如果paradox870的前言回答他的回答是這樣的：「我看到之前的人在JavaScript中回答了這個方法，但我也想指出，這可以在PHP中執行......實際上，這是一種方法所以......「。我發現，如果您嘗試提供比原始問題更多的幫助，那麼stackoverflow的用戶往往會很快變得消極......有時他們會過度。我可以理解這一點，我並不是首先回答問題，而是告訴某人以另一種方式去做，但在這種情況下，問題實際上已經回答了，他只是指出了一個替代方案。 – TheSatinKnight 2015-03-19 03:05:00

如何預先填充url參數中的html表單輸入字段？

回答

相關問題