Jquery提交表单后,页面自动刷新问题

简介:

现象:

1、使用jquery体检提交表单后,页面重新加载
2、spring-boot报:o.s.web.servlet.PageNotFound: Request method 'POST' not supported

提交按钮

<button onclick="ligin();">Login</button>

Jquery代码

  function ligin(){
        var data=$('#loginForm').serialize();
        //序列化获得表单数据
        var submitData=decodeURIComponent(data,true);
       //submitData是解码后的表单数据,结果同上
        $.ajax({
            url:'http://localhost:8082/login.do',
            type:'GET',
            data:submitData,
            cache:false,//false是不缓存,true为缓存
            async:true,//true为异步,false为同步
            beforeSend:function(){
                //请求前
            },
            success:function(data){
                if(data){
                    Authorization=data;
                    $.cookie("Authorization","Bearer "+Authorization,{expires:0.02,path: '/'});
                    alert(data);
                    //window.location.assign('/index.html');
                }
                
            },
            error:function(){
                //请求失败时
            }
        })
    }

原因

1、如果想将提交按钮放在form中,则必须把<button></button> 替换为<input type="button" onclick="ligin();" value="Login"/>

2、直接把<button></button>放在form外

目录
相关文章
|
5月前
|
JavaScript 前端开发
jQuery实现从一个页面跳转到另一个页面的指定tab选项卡
jQuery实现从一个页面跳转到另一个页面的指定tab选项卡
49 0
|
5月前
|
JavaScript
jQuery实现动态添加和删除(点击按钮添加在页面添加和删除元素)
jQuery实现动态添加和删除(点击按钮添加在页面添加和删除元素)
49 0
|
6月前
|
JavaScript
Jquery插件知识之Jquery.cookie实现页面传值
Jquery插件知识之Jquery.cookie实现页面传值
36 0
|
7月前
|
JSON JavaScript 数据格式
jQuery操作页面元素属性和内容
jQuery操作页面元素属性和内容
39 0
|
24天前
|
安全 JavaScript 数据安全/隐私保护
jQuery会员中心安全修改表单特效
jQuery实现的会员中心安全修改表单特效代码是一款实现了可以修改登录密码,交易密码,手机号码,实名认证,电子邮箱,安全设置表单,会员表单等设置效果的代码
14 4
jQuery会员中心安全修改表单特效
|
6月前
|
JavaScript 前端开发
前端基础 -JQuery之 表单选择器
前端基础 -JQuery之 表单选择器
26 0
|
6月前
|
缓存 前端开发 JavaScript
【前端用法】jquery获取当前页面的URL信息
【前端用法】jquery获取当前页面的URL信息
51 0
|
2月前
|
JavaScript 前端开发 数据格式
2022年11月23日——jQuery——T1(基础选择器与表单选择器)
2022年11月23日——jQuery——T1(基础选择器与表单选择器)
44 0
|
4月前
|
JavaScript 前端开发 Python
五分钟学 | Flask 使用 JQuery 上传数据并展示在页面上
五分钟学 | Flask 使用 JQuery 上传数据并展示在页面上
|
5月前
|
移动开发 JSON JavaScript
七个帮助你处理Web页面层布局的jQuery插件
七个帮助你处理Web页面层布局的jQuery插件
42 0