先查看<form>标签是否有action属性,如果没有,并且最后<button>标签的type属性为'submit‘时,默认提交位置就是当前页面

如果在页面右键检查,点击网络,会在开头发现这样的post包:

在右侧消息头处可见,请求网址为当前网址,并且响应头部类型为html

所以只要把form表单里最后提交按钮type="submit"换为type="button",把按钮变成原生按钮,

就可以正确使用ajax方法传递数据,原因就是form表单最后的提交按钮与使用ajax传递数据冲突了

因为这个原因浪费了挺久时间,甚至把代码又从头到尾写了一遍(感觉自己好蠢啊!),总结了一下调试过程。

先贴一下ajax代码:

        $(function () {
$("#register").on('click',function () {
$.ajax({
type: 'post',
url:"{:url('insert')}",
data:$('#login').serialize(),
dataType:'json',
success:function (data) {
alert('成功');
},
error:function () {
alert('error');
}
})
})
});

这里‘#register’是提交按钮,‘#login’是表单,url发送到一个php脚本(插入表单数据到数据库)。

用谷歌浏览器打开页面,点击注册按钮后,当前页面刷新,没有任何反应。

正常情况下,ajax执行正确或失败,根据上述代码都应该有消息弹窗,于是感觉到哪里出了问题。

打开数据库,发现表单的数据都已经插入到数据库了,说明后台php脚本是运行成功的,只是在返回数据的时候出现了问题。

右键检查找到该post包,发现响应头部类型为html,而我设置的返回类型为json。

更换了Edge浏览器,问题同样是数据库插入了数据,但是结果没有消息弹窗。

更换火狐浏览器,再次点击注册按钮时出现了消息弹窗,但是闪了一下就没了!隐隐约约发现弹窗显示为‘error’(感谢火狐浏览器!)

根据alert弹窗一闪而过这个线索,发现了解决问题的这篇文章,同时感谢这篇文章的博主。

参考:关于layer的提示框,弹出框一闪而过的问题

JQuery的ajax函数执行失败,alert函数弹框一闪而过的更多相关文章

  1. 关于jquery ajax不执行success回调函数

    检查error函数是否执行,发现错误信息为parseerror,表示jquery解析返回结果时失败,只需要将ajax参数dataType:"json"改为"text js ...

  2. 详解Ajax请求(三)——jQuery对Ajax的实现及serialize()函数对于表单域控件参数提交的使用技巧

    原生的Ajax对于异步请求的实现并不好用,特别是不同的浏览器对于Ajax的实现并不完全相同,这就意味着你使用原生的Ajax做异步请求要兼顾浏览器的兼容性问题,对于java程序员来讲这是比较头疼的事情, ...

  3. PHP代码审计3-SQL注入,CSRF,动态函数执行与匿名函数执行,unserialize 反序列化漏洞,变量覆盖,文件管理,文件上传

    SQL注入 审计语句 [输入参数] SELECT,DELETE,UPDATE,INSERT 防御 转义: 1.开启gpc:判断解析用户提示的数据 2.mysql_real_escape_string( ...

  4. js alert(“”)弹框 自定义样式

    首先用css渲染一个样式 #msg{ height: 2rem; text-align: center; position: fixed; top: 50%; margin-top: -1rem; l ...

  5. Jquery中和ajax有关的方法

    Jquery关于ajax有一系列的方法函数,单单知道$.ajax()显然是不够的,接下来我们对该系列的方法函数逐一研究下. ajaxComplete(callback).ajaxError(callb ...

  6. jQuery版AJAX简易封装

    开发过程中,AJAX的应用应该说非常频繁,当然,jQuery的AJAX函数已经非常好用,但是小编还是稍微整理下,方便不同需求下,可以简化输入参数,下面是实例代码: $(function(){ /** ...

  7. 封装jquery的ajax

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. 你好,C++(29)脚踏两只船的函数不是好函数 5.4 函数设计的基本规则

    5.4  函数设计的基本规则 函数是C++程序的基本功能单元,就像一块块砖头可以有规则地垒成一座房子,而一个个函数也可以有规则地组织成一个程序.我们在大量使用他人设计好的函数的同时,也在设计大量的函数 ...

  9. 函数的上下文就是函数里面的this是谁

    规律1:函数用圆括号调用,函数的上下文是window对象 比如小题目: function fun(){ var a = 888; alert(this.a); //实际上访问的是window.a } ...

随机推荐

  1. Android Studio 快速实现上传项目到Github(详细步骤)

    前言: 本文主要讲解如何将Android Studio项目上传至GitHub,在此之前,先介绍几个概念. Android Studio:是谷歌推出一个Android集成开发工具,基于IntelliJ ...

  2. mysql 字符串函数、分组函数

    字符串函数 1.concat 函数 drop table test;create table test(id int(4), name varchar(10), sex char(2));insert ...

  3. leetCode题解 Reverse Words in a String III

    1.题目描述 Given a string, you need to reverse the order of characters in each word within a sentence wh ...

  4. css.map作用

    看一段sass代码: 嵌套书写的结构在sass中经常会被用到. 编译之后的样式是这样的: 在开发工具上我们看到的是编译后的文件,而非编译前的源文件. 这个时候就产生一个问题了.在生产环境中,我希望看到 ...

  5. armel和armhf区别

    出于低功耗.封装限制等种种原因,之前的一些ARM架构处理器因为内部资源宝贵,加入浮点运算单元是十分奢侈的,因为需要额外的软件实现.之前的ARM处理器架构是什么样的?(http://www.cnblog ...

  6. 国内一元钱 正常搭建android开发环境

    如果你人在gfw之外,那么此篇文章对你来说毫无用处,请自动略过.. 笔者自android出来之后,就一直想尝试一下.可惜,几年来一直未能够定下身心来研究尝试.而所做的工作也与android没有关系,所 ...

  7. Oracle EBS 隐藏帮助-诊断-检查

  8. cef开启摄像头和录音

    参考资料:https://github.com/cztomczak/phpdesktop/wiki/Chrome-settings#command_line_switches CefSharp中文帮助 ...

  9. Oracle案例12——NBU Oracle恢复

    最近在做NBU ORACLE备份的恢复测试,执行恢复时报错ORA-27211: Failed to load Media Management Library,具体处理过程如下:一.错误信息 执行命令 ...

  10. 山寨今日头条的标题title效果

    山寨今日头条的标题title效果 效果: 源码: // // ViewController.m // 今日头条 // // Created by YouXianMing on 14/11/26. // ...