Javascript 提交表单时如何将变量捕获到window.location.search中？_Javascript_Html_Forms_Variables

Javascript 提交表单时如何将变量捕获到window.location.search中？

javascript html forms variables

Javascript 提交表单时如何将变量捕获到window.location.search中？,javascript,html,forms,variables,Javascript,Html,Forms,Variables,好的，我有一个表格，下面是我想用它做的：提交后，（如果提交成功）：将表单中特定输入字段“x”的值捕获到变量“xval”中将变量“xval”的值附加到url 并导航到特定页面看，我有一些页面的内容是有条件的，这取决于我通过url传递的变量。。。因此，步骤1中的地址如下所示： whatever.com/products.html?home?try 在第2步，即表单上，它看起来是这样的“ 步骤3，应该读取url，并相应地显示信息重申一下，我不知道当用户完成第2步时如何捕获变量并将它们附

好的，我有一个表格，下面是我想用它做的：

提交后，（如果提交成功）：

将表单中特定输入字段“x”的值捕获到变量“xval”中
将变量“xval”的值附加到url
并导航到特定页面

看，我有一些页面的内容是有条件的，这取决于我通过url传递的变量。。。因此，步骤1中的地址如下所示：

whatever.com/products.html?home?try

在第2步，即表单上，它看起来是这样的“

步骤3，应该读取url，并相应地显示信息

重申一下，我不知道当用户完成第2步时如何捕获变量并将它们附加到url

我在submit按钮上尝试了一个函数，它会导致导航在没有提交验证的情况下触发…我在表单标记本身上尝试了“onsubmit”事件处理程序，但它似乎不起作用

想法？建议？

请确保在输入组件上设置“名称”属性。如果使用类似的简单表单提交，则应将值附加到url

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <title>Untitled Document</title>
    </head>
    <body>
        <form>
            <input id="txt-name" name="name"/>
            <button type="submit">Submit</button>
        </form>
    </body>
</html>


无标题文件
提交

我想说：坚持公认的在GET字符串中定义表单字段的方法（

？this=that&foo=bar

）。这是一种用新参数加载页面的方法：

var locationstr = location.href.split('?')[0], //URL without params
    try = document.getElementById('try_inputfield').value,
    email = document.getElementById('email_inputfield').value,
    newLocation = [locationStr,
                   '?home=1',
                    '&try=',
                     try,
                    '&email=',
                     email].join('');         // glue new parameters
location.replace(newLocation);                // replace location

如果要读取并使用根据

位置定义的属性。search

这是一个字符串扩展，用于将查询字符串转换为对象：

String.prototype.q2obj = function(){
    var qArr = this.split('&')
        ,qObj = {}
        ,i =-1;
    while(++i<qArr.length) {
            qfrag = qArr[i].split('=');
            qObj[qfrag[0]] = qfrag[1];
   }
   return qObj;
};
//usage
var queryObj = location.search.substr(1).q2obj();

String.prototype.q2obj=函数（）{
var qArr=this.split（“&”）
，qObj={}
，i=-1；
（++i您是否尝试过使用method=“GET”设置表单"
？URL中不能有多个问号。如果有，我相信您将遇到意外行为和跨浏览器困难…查询字符串应编码为类似page=home&action=try&stage=5&email的内容=john@gmail.com@Pointy-不，我会试试的…@vitch-真的吗？我一直在用有多个问号等等…但是好的，谢谢你的提醒…@vitch-这有点离题了，但是你能给我解释一下如何按你的方式传递变量吗？在我的情况下，我使用“？”作为拆分器，将不同的位置捕捉到不同的变量中。请注意，这只在js中，没有服务器端脚本…@vitc好的，我读了一些书，我有一个从bloggingdeveloper.com获得的函数，它允许我从querystring中获取值，但是设置它们怎么样？这是一个普通的设置过程吗--“window.location.href？page='+source+&action='+action+'&stage='+stage+'&email='+email”；对不起，我不太明白，你能解释一下这里发生了什么，以及你打算如何解决我的问题吗？我不知道html标记有一个“type”属性…我不会像其他人那样说它，所以从阅读本页开始：基本上submit按钮向服务器提交一个新的get请求。submit按钮也有“方法”属性，可用于指定操作是post。当执行新的get请求时，表单构造参数字符串。通过获取所有名称属性并将其放入键值对中来构造参数字符串。参数字符串以？开头，然后追加键值对，如key=value和由&.分隔，因此参数字符串类似于？key1=value1&key2=value2
String.prototype.q2obj = function(){
    var qArr = this.split('&')
        ,qObj = {}
        ,i =-1;
    while(++i<qArr.length) {
            qfrag = qArr[i].split('=');
            qObj[qfrag[0]] = qfrag[1];
   }
   return qObj;
};
//usage
var queryObj = location.search.substr(1).q2obj();