submit表单提交的方法

我现在有一个页面

<form method="post" action="https://test/regist/Reg2">
<div>
姓:<input name="test1" type="text" />
名:<input name="test2" type="text" />
</div>
<div>
邮编<input name="test3" type="text" />-<input name="test4" type="text" />
</div>
<button  name="ok" type="submit">
 </button>
</form>

这种页面,我现在需要submit的时候把 'test1'和'test2'合并成'name'

把'tets3'和‘test4'合并成addr
这就不能用按钮自带的submit了,应该要怎么写才能达到和按钮自带的submit相同的传参?

用ajax。
在按钮上加一个点击事件,把buttin的type="submit"去掉,把form标签去掉。在事件中做数据操作,然后使用ajax完成数据传递。ajax怎么写就不赘述了。
思路:点击按钮,触发事件,事件中做值的合并操作,并使用ajax向https://test/regist/Reg2发送数据

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>the final project</title>
    <link rel="stylesheet" href="css/finalproject.css" />
    <script src="js/finalproject.js"></script>
    <style>
    </style>
</head>

<body class="bkgimg">


        <!-- <form method="post" action="https://test/regist/Reg2"> -->
            <div onchange="myFunction()">
                <div>
                姓:<input name="test1" type="text" id="text1"//>
                名:<input name="test2" type="text" id="text2"//>
                </div>
                <div>
                邮编<input name="test3" type="text" id="text3"/>-<input name="test4" type="text" id="text4"//>
                </div>
                <div onclick="clickfunc()">提交</div>
            </div>

    <!-- </center> -->
    <script>
        var obj = {}
        var text1 = document.getElementById('text1').value
        console.log('--------',text1)
        // obj.name = 
        function myFunction(ev){
            var ev = ev || window.event;
            var oinput = ev.srcElement || ev.target;
            if(oinput.nodeName.toLowerCase() == 'input'){
                if(oinput.id=='text1'){
                    obj.name = oinput.value
                }else if(oinput.id == 'text2'){
                    obj.name = obj.name + oinput.value
                }else if(oinput.id == 'text3'){
                    obj.addr = oinput.value
                }else{
                    obj.addr = obj.addr + oinput.value
                }
                console.log('========',obj)
            }      
        }
        function clickfunc(){
            var httpRequest = new XMLHttpRequest();//第一步:创建需要的对象
            httpRequest.open('POST', 'url', true); //第二步:打开连接/***发送json格式文件必须设置请求头 ;如下 - */
            httpRequest.setRequestHeader("Content-type","application/json");//设置请求头 注:post方式必须设置请求头(在建立连接后设置请求头)var obj = { name: 'zhansgan', age: 18 };
            httpRequest.send(JSON.stringify(obj));//发送请求 将json写入send中
            /**
             * 获取数据后的处理程序
             */
            httpRequest.onreadystatechange = function () {//请求后的回调接口,可将请求成功后要执行的程序写在其中
                if (httpRequest.readyState == 4 && httpRequest.status == 200) {//验证请求是否发送成功
                    var json = httpRequest.responseText;//获取到服务端返回的数据
                    console.log(json);
                }
            };
        }
    </script>
</body>

</html>

希望对你有用

后端接收的时候直接拼接不香么