blocks|key|739625|text|使用自定义查询字符串Javascript函数。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|739626|function+querySt(ji)+{

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

++++for+(i=0;i<gy.length;i%2B%2B)+{
++++++++ft+=+gy[i].split("=");
++++++++if+(ft[0]+==+ji)+{
++++++++++++return+ft[1];
++++++++}
++++}
}
var+koko+=+querySt("koko");|code-block|syntax|javascript|739627|然后将检索到的值赋给输入控件；如下所示：|739628|document.getElementById('mytxt').value+=+koko;|739629|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

Use a custom query string Javascript function.

<pre><code>function querySt(ji) {

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

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

Then assign the retrieved value to the input control; something like:

<pre><code>document.getElementById('mytxt').value = koko;
</code></pre>

blocks|key|955514|text|function+getUrlVars()
{
++++var+vars+=+[],+hash;
++++var+hashes+=+window.location.href.slice(window.location.href.indexOf('?')+%2B+1).split('&');

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

+++++return+vars;
}

var+get+=+getUrlVars();

//returns+get['forename']+==+bob;+surname+==+jones|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|955515|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

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

 for(var i = 0; i &lt; 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
</code></pre>

blocks|key|955551|text|你在使用PHP吗？如果是这样的话，事情就变得容易多了。假设您的链接与上面的链接相同，您可以使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|955552|<?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;+?>'+>|code-block|syntax|javascript|955553|这应该会为你预先填充。|955554|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

Are you using PHP? If so, that makes things much easier. Assuming your link as above, you can use:

<pre><code>&lt;?php
$forename = $_GET['forename'];
$surname = $_GET['surname'];
?&gt;
----------
&lt;input id='forename' type='text' value='&lt;?php echo $forename; ?&gt;' &gt;
&lt;input id='surname' type='text' value='&lt;?php echo $surname; ?&gt;' &gt;
</code></pre>

That should pre-populate for you.

blocks|key|739742|text|以下是内置方法，以供参考：https://developer.mozilla.org/en-US/docs/Web/API/URL/searchParams|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|739743|您可以将当前地址的参数实例化为URL对象，而无需导入任何库，如下所示：|739744|let+params+=+(new+URL(document.location)).searchParams;|code-block|syntax|javascript|739745|然后，您可以直接引用它们：|739746|let+name+=+params.get('name');|739747|或者，您可以使用循环遍历它们，如下所示：|739748|for+(const+[key,+value]+of+params.entries())+{}|739749|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/Web/API/URL/searchParams^0|D|1T|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|10|8|@]|9|@$A|11|B|12|1|13]]|C|$]]|$1|D|3|E|5|6|7|14|8|@]|9|@]|C|$]]|$1|F|3|G|5|H|7|15|8|@]|9|@]|C|$I|J]]|$1|K|3|L|5|6|7|16|8|@]|9|@]|C|$]]|$1|M|3|N|5|H|7|17|8|@]|9|@]|C|$I|J]]|$1|O|3|P|5|6|7|18|8|@]|9|@]|C|$]]|$1|Q|3|R|5|H|7|19|8|@]|9|@]|C|$I|J]]|$1|S|3|-4|5|6|7|1A|8|@]|9|@]|C|$]]]|T|$U|$5|V|W|X|C|$Y|Z]]]]

Here is the builtin way, for reference:
<a href="https://developer.mozilla.org/en-US/docs/Web/API/URL/searchParams" rel="nofollow noreferrer">https://developer.mozilla.org/en-US/docs/Web/API/URL/searchParams</a>
You can instantiate the current address's parameters as a URL object without importing any libraries as shown here:
<pre><code>let params = (new URL(document.location)).searchParams;
</code></pre>
Then you can reference them directly:
<pre><code>let name = params.get('name');
</code></pre>
Or you can cycle through them with a loop such as:
<pre><code>for (const [key, value] of params.entries()) {}
</code></pre>

I have a vanilla html page which has a form in it. A requirement has come in to be able to pre-populate the form via the url. Something like:

<pre><code>http://some.site.com/somePage.html?forename=Bob&amp;surname=Jones
</code></pre>

I can't seem to find any simple solution to this. Can someone point me in the right direction with some javascript to accomplish this? Happy to use a javascript solution, but I'd prefer to avoid pulling in an entire library just for this single use (none are currently used). Thanks.

How can I pre-populate html form input fields from url parameters?

我有一个普通的html页面，其中有一个表单。已经有了能够通过url预先填充表单的要求。类似于：http://some.site.com/somePage.html?forename=Bob&surname=Jones我似乎找不到任何简单的解决方案。有人能用一些javascript给我指明正确的方向来完成这件事吗？我很乐...

问如何从url参数预先填充html表单输入字段？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何从url参数预先填充html表单输入字段？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何从url参数预先填充html表单输入字段？
EN