Javascript 如何使用onsubmit转到另一个html页面而不删除数据

我的代码将无法工作，因为我试图让我的值提交到另一个html页面，同时保留它们。如果我输入

返回false它将转到下一个HTML页面，而不保留值；如果没有，它会保留这些值，而不会转到下一页。请帮助，如果这实际上是可能的，如果不是，请给我其他的建议


document.getElementById（'form'）。onsubmit=function（e）{
班级比赛{
构造函数（名称1、名称2）{
this.name1=name1；
this.name2=name2；
}
}
常量p1=document.querySelector（“#person1”）.value；
const p2=document.querySelector（“#person2”）.value；
常量对=新匹配项（p1，p2）；
log（${pair.name1}和${pair.name2}）；
返回false；
};

发货❥
你的魔法船是什么？



删除
onSubmit
事件侦听器的代码
将name属性添加到
输入
元素
HTML[当前页面]

<form action="pages/lodaing.html" id="form"> 
    <input type="text" placeholder="Your Firstname" name="person1"
                    autocomplete="off">
    <input type="text" placeholder="Their Firstname" name="person2" autocomplete="off"><br>
    <button id="button" type="submit">Submit</button>
</form>

function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, '\\$&');
    var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, ' '));
}

var person1 = getParameterByName('person1');
var person2 = getParameterByName('person2');

console.log(person1,person2);

解释

这里发生的事情是

当前页面[HTML]上的表单在“pages/lodaing.HTML”上提交get请求

当使用“Get”方法提交表单[这是默认值]时，新页面将加载表单值作为从表单输入创建的查询参数[？param1=value1¶m2=value2]

因此，我们编写了一些脚本，以从下一页的url中获取精确的参数值

在Javascript函数中，我们传递参数名，我们需要为其获取提交的值

函数解析模式的url字符串，搜索我们传递的键，并返回相同的值

希望这对你来说很容易理解

删除
onSubmit
事件侦听器的代码
将name属性添加到
输入
元素
HTML[当前页面]

<form action="pages/lodaing.html" id="form"> 
    <input type="text" placeholder="Your Firstname" name="person1"
                    autocomplete="off">
    <input type="text" placeholder="Their Firstname" name="person2" autocomplete="off"><br>
    <button id="button" type="submit">Submit</button>
</form>

function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, '\\$&');
    var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, ' '));
}

var person1 = getParameterByName('person1');
var person2 = getParameterByName('person2');

console.log(person1,person2);

解释

这里发生的事情是

当前页面[HTML]上的表单在“pages/lodaing.HTML”上提交get请求

当使用“Get”方法提交表单[这是默认值]时，新页面将加载表单值作为从表单输入创建的查询参数[？param1=value1¶m2=value2]

因此，我们编写了一些脚本，以从下一页的url中获取精确的参数值

在Javascript函数中，我们传递参数名，我们需要为其获取提交的值

函数解析模式的url字符串，搜索我们传递的键，并返回相同的值

希望这对你来说很容易理解
 让表单通过GET方法发送值（这是默认设置）您可以在下一页使用JavascriptURLSearchParams对象，该对象具有处理传递数据所需的全部功能。使用此对象，您可以避免在第一页上使用Javascript代码，当然，除非您需要特定的数据检查和/或操作

签出URLSearchParams

注意：
在代码中，您必须为输入字段指定属性名称，这些字段的值要传递到另一个HTML页面，因为编写时表单将不发送任何内容。
通过GET方法（这是默认方法）使表单发送值，您可以在下一页上使用JavascriptURLSearchParams对象，此对象具有处理传递的数据所需的全部内容。使用此对象，您可以避免在第一页上使用Javascript代码，当然，除非您需要特定的数据检查和/或操作

签出URLSearchParams

注意：
在您的代码中，您必须为输入字段指定属性名称，这些字段的值要传递到另一个HTML页面，因为编写时表单将不发送任何内容。
您的HTML错误（表单>a>按钮>a）您的HTML错误（表单>a>按钮>a）很高兴为您提供帮助，也请向上投票回答，我刚开始我不能投票，因为某些原因，但它说它会被计算但不会显示。很抱歉打扰您，如果您有足够的时间，请在您的答案中编辑一个解释。我真的是一个新的编码场景，我很迷茫。非常感谢。我在回答中添加了更多的解释谢谢你，我不会再打扰你了！很高兴提供帮助，请也更新投票答案，会很有帮助我刚开始我无法更新投票，因为某些原因，但它说它将被计算但不会显示。很抱歉打扰您，但如果您有足够的时间，请在您的答案中编辑一个解释。我真的是一个新的编码场景，我很迷茫。非常感谢。我在回答中添加了更多的解释谢谢你，我不会再打扰你了！