JS实现form表单的跳转

最新推荐文章于 2024-07-06 22:40:10 发布

blissLX

最新推荐文章于 2024-07-06 22:40:10 发布

阅读量1.8w

点赞数 2

分类专栏： JavaScript 文章标签： java JavaScript

本文链接：https://blog.csdn.net/weixin_37189727/article/details/85320879

版权

JavaScript 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

form表单提交时需要从一个页面跳转至不同的页面，使用js动态提交

例如：1.jsp跳转至2.jsp和3.jsp

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>跳转</title>
<script type="text/javascript">
   //把表单的action改为2.jsp
   function Two() {
       document.form.action = "2.jsp";
       document.form.submit();
   }
   //把表单的action改为3.jsp
   function Three() {
       document.form.action = "3.jsp";
       document.form.submit();
   }
</script>
</head>
<body>

<form action="" method="post" name="form">
   <table width="300" border="1" align="center" bgcolor="#9AD3A4" bordercolor="red">
       <tr><td align="center" colspan="2" >button跳转</td></tr>
       <tr>
           <td><input type="button" value="跳转到2.jsp" οnclick="Two()"      class="botton"/></td>
           <td><input type="button" value="跳转到3.jsp" οnclick="Three()"    class="botton"/></td>
       </tr>
   </table>
</form>
</body>
</html>

JavaScript解决一个带验证的Form两个Submit事件（一个使用【AJAX实现】，一个页面提交并跳转）

<form class="form-horizontal" action="xxx" method="post" enctype="multipart/form-data" data-   toggle="validator" role="form" novalidate="true" id="patentEditForm"> 
       <button class="btn btn-primary" type="button" id="but_sub">保存</button>
       <button class="btn btn-primary" type="button">保存返回列表</button>
       <button class="btn btn-warning" type="button" οnclick="window.location='/biz/project/list';">
           返回
       </button>
</form>

$(document).ready(function(){
    var buttonId;

    $('#patentEditForm').validator().on('submit', function (e) {
            if(buttonId == "but_sub"){
                var formData = new FormData($("#patentEditForm")[0]);
                $.ajax({
                    type:"POST",
                    url:"/biz/",
                    data: formData,
                    dataType:"JSON",
                    nsync:false,
                    cache: false,
                    contentType: false, 
                    processData: false,
                    success:function(date){
                        switch(date.status){
                        case 1:
                            $success("保存成功！");
                            break;
                        case 1009:
                            $error("保存失败！");
                            break;
                        default :
                            $error("没有提交信息");
                        }
                    },
                    error:function(){
                        $error("没有提交信息");
                    }
                });
        }
    });

    $(".btn-primary").click(function(){
        buttonId = $(this).attr("id");
        $('#patentEditForm').trigger('submit');
    });