只是想知道Javascript中是否有内置的东西可以接受表单并返回查询参数,例如:“var1=value&var2=value2&arr[]=foo&arr[]=bar…”
我已经想了很多年了。
只是想知道Javascript中是否有内置的东西可以接受表单并返回查询参数,例如:“var1=value&var2=value2&arr[]=foo&arr[]=bar…”
我已经想了很多年了。
当前回答
UrlSearchParams API是一个很好的建议,但我不敢相信没有人提到非常有用的.get和.set方法。它们可以用于操作查询字符串,不仅非常容易使用,还可以解决您可能遇到的许多问题。例如,在我的例子中,我想构建一个没有重复键的查询字符串。.set为您解决了这个问题。引用MDN文档:
URLSearchParams.set () 将与给定搜索参数关联的值设置为给定值。如果有多个值,则删除其他值。
示例(来自MDN):
let url = new URL('https://example.com?foo=1&bar=2');
let params = new URLSearchParams(url.search);
// Add a third parameter
params.set('baz', 3);
params.toString(); // "foo=1&bar=2&baz=3"
另一种更短的语法:
let url = new URL('https://example.com?foo=1&bar=2');
// Add a third parameter
url.searchParams.set('baz', 3);
url.searchParams.toString(); // "foo=1&bar=2&baz=3"
其他回答
对于那些喜欢jQuery的人来说,你可以使用表单插件:http://plugins.jquery.com/project/form,它包含一个formSerialize方法。
如果您不想使用库,这应该涵盖大多数/所有相同的表单元素类型。
function serialize(form) {
if (!form || !form.elements) return;
var serial = [], i, j, first;
var add = function (name, value) {
serial.push(encodeURIComponent(name) + '=' + encodeURIComponent(value));
}
var elems = form.elements;
for (i = 0; i < elems.length; i += 1, first = false) {
if (elems[i].name.length > 0) { /* don't include unnamed elements */
switch (elems[i].type) {
case 'select-one': first = true;
case 'select-multiple':
for (j = 0; j < elems[i].options.length; j += 1)
if (elems[i].options[j].selected) {
add(elems[i].name, elems[i].options[j].value);
if (first) break; /* stop searching for select-one */
}
break;
case 'checkbox':
case 'radio': if (!elems[i].checked) break; /* else continue */
default: add(elems[i].name, elems[i].value); break;
}
}
}
return serial.join('&');
}
var 参数 = { 宽度:1680, 高度:1050 }; var str = jQuery.param( params ); console.log(str) <script src=“https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js”></script>
如果你正在使用jQuery,你可能想要查看jQuery.param() http://api.jquery.com/jQuery.param/
例子:
var params = {
parameter1: 'value1',
parameter2: 'value2',
parameter3: 'value3'
};
var query = $.param(params);
console.log(query);
这将打印出:
parameter1=value1¶meter2=value2¶meter3=value3
正如Stein所说,您可以使用http://www.prototypejs.org中的原型javascript库。 包括JS,这很简单,$('formName').serialize()将返回你想要的!