52,797
社区成员
发帖
与我相关
我的任务
分享AJAX提交表单后，页面被刷新，求解
提交表单后，后能能正常接收到数据，但是表单当前页面自动刷新，求解，已试过 async: false,
$(document).ready(function() {
$("#signinButt").click(function() {
$.ajax({
url: 'signinValidation',
type: 'POST',
datatype: 'JSON',
data: $('#signinForm').serialize(),
})
.done(function() {
console.log("success");
})
.fail(function() {
console.log("error");
});
});
});
<form method="post" id="signinForm">
<div class="form-group mb10">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input type="text" class="form-control" placeholder="Enter Username" name="adminName" />
</div>
</div>
<div class="form-group nomargin">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
<input type="password" class="form-control" placeholder="Enter Password" name="adminPass" />
</div>
</div>
<div><br /><br /><br /></div>
<div class="form-group">
<button class="btn btn-success btn-quirk btn-block btn-lg" id="signinButt">登 陆</button>
</div>
</form>
...全文
请发表友善的回复…
发表回复
seongy 2019-08-09
- 打赏
- 举报
因为button的默认type就是submit，如果把button标签里面加一个属性：type="button"，就好了
cretruman 2017-11-08
- 打赏
- 举报
解决了，谢谢。我之前的是type=submit,确实改为button就好了。
oKuaiLeDeXiaoZhu 2017-03-23
- 打赏
- 举报
button提交按钮放在form表单里面，需要用<input type="button" id="" value=""/> ，不可以用submit，按钮放在form表单外面两个都可以，一般用ajax提交form表单 按钮放在外面比较好
qq_35358347 2017-03-17
- 打赏
- 举报
嘿嘿，简单，button或者input的type不要设置成submit就没事了
weixin_37500381 2017-02-10
- 打赏
- 举报
"SuperAdmin"+"atguigu",难道是师兄~
qq_28314843 2016-12-22
- 打赏
- 举报
非常感谢 <input type="button"> 弄了两个小时了
TuskueNeko 2016-12-12
- 打赏
- 举报
搞了半天 加个Button就好了 哎。。。。
cmontxgt 2016-11-21
- 打赏
- 举报
非常感谢楼上
qq_16859535 2016-09-07
- 打赏
- 举报
加个type=“button”就行了
dreamwszl 2016-08-24
- 打赏
- 举报
卧槽 万分感谢，尼玛死活调不过来的程序，我还在action里面配置半天
qq_32902941 2016-08-05
- 打赏
- 举报
万分感谢，真的了，不过<button></button>跟<input type="button"/>的区别是什么，为毛还回刷新
软工苦哈哈 2016-01-22
- 打赏
- 举报
what fuck ... sb html 我在那愣是提交了半个小时，还是一直刷新，找不到问题所在。 原因是我的提交按钮用的是button标签，后来改成了 <input type="button"> 就尼玛可以了 真是无语了
软工苦哈哈 2016-01-22
- 打赏
- 举报
我也遇到了此问题，请问楼主是怎么解决的？
kissky007 2015-11-01
- 打赏
- 举报
谢谢，问题已解决
slwsss 2015-11-01
- 打赏
- 举报
$("#signinButt").click(function() {
$.ajax({
url: 'signinValidation',
type: 'POST',
datatype: 'JSON',
data: $('#signinForm').serialize(),
})
.done(function() {
console.log("success");
})
.fail(function() {
console.log("error");
});
return false
});
1．本书附源代码共计381个，其运行环境如下：
IE 5或更高版本
Mozilla Firefox 1.5.0.3或更高版本
服务器采用IIS5.1 或以上版本
数据库使用MS Access 2000以上
2．本书所附光盘实例代码：
第1章（\第1章）
查看1.2.htm中noscript显示效果的方法如下：
1．将该实例复制到C:\Inetpub\wwwroot下；
2．选择浏览器的“工具”－“安全”－“本地Intranet”－“自定义级别”－“活动脚本”中选用“禁用”单选框
3．在浏览器中输入下述地址：http://localhost/1.2.htm
• 1.1.htm 多段代码相互调用
• 1.2.htm <script>与表单上调用事件
• 9.11.htm attachEvent()方法
• 9.12.htm 事件流测试
• 9.13.htm DOM2 事件模型基本语法
• 9.14.htm DOM2 鼠标事件
• 9.15.htm 取消默认动作之一
• 9.16.htm 取消默认动作之二
• 9.17.htm 创建事件
第10章（\第10章）
• 10.1.htm 鼠标事件处理
• 10.2.htm 页面预览
• 10.3.htm 图像切换
• 10.4.htm 接收键盘输入
• 10.5.htm 用鼠标点亮文本
• 10.6.htm 图片跟随鼠标
• 10.7.htm 文字跟随鼠标
• 10.8.htm 星星跟随鼠标
• 10.9.htm 鼠标感应 弹出警告框
• 10.10.htm 鼠标感应 渐显图片
• 10.11.htm 禁用鼠标右键
第11章（\第11章）
• 11.1.htm 省略window的alert()方法
• 11.2.htm 未省略window的alert()方法
• 11.3.htm 未省略window的document.write()方法
• 11.4.htm Document对象部分属性与方法的使用
• 11.5.htm HTML文档属性属性
• 11.6.htm 同时使用name和id
• 11.7.htm 事件控制器的例子
• 11.8.htm JavaScript实现事件控制器
• 11.9.htm 元素属性综合应用
• 11.10.htm 动态修改表单元素内容
第12章（\第12章）
• 12.1.htm Document树的简单例子
• 12.2.htm getElementById()方法
• 12.3.htm DOM结点属性
• 12.4.htm 文档树检测
• 12.5.htm 结点插入与追加
• 12.6.htm 结点复制
• 12.7.htm 结点删除与替换
• 12.8.htm 处理文本结点的方法
• 12.9.htm 处理属性的方法
• 12.10.htm HTMLElement对象
• 12.11.htm DOM遍历API
• 12.12.htm DOM Range API
• 12.13.htm 读取HTML元素内容
• 12.14.htm 修改HTML元素内容
• 12.15.htm innerText、outerText、outerHTML属性
• 12.16.htm document.all[]
第13章（\第13章）
• 13.1.htm HTML对象模型
• 13.2.htm DHTML对象模型
• 13.3.htm DHTML对象模型方法显示和修改网页文字内容
• 13.4.htm DHTML对象模型方法新增和删除表格行内容
• 13.5.htm W3C对象模型方法显示和修改网页内容
• 13.6.htm W3C对象模型方法显示和修改表格内容
• 13.7.htm “相对位置”定位
• 13.8.htm “绝对位置”定位
• 13.9.htm z-index属性
• 13.10.htm z-index属性之二
• layerlib.js 跨浏览器DHTML库
• 13.12.htm 跨浏览器DHTML库的使用
第14章（\第14章）
• 14.1.htm confirm()方法用作判断条件
• 14.2.htm alert()方法与confirm()方法的使用
• 14.3.htm prompt()方法的使用
• 14.4.htm window.open()方法
• 14.5.htm 用链接和按钮实现窗口打开
• 14.6.htm 窗口的打开和关闭
• 14.7.htm 安全关闭窗口
• 14.8.htm 窗口特征属性综合举例
• 14.9.htm 一个窗口写入的简单例子
• 14.10.htm 动态写入HTML代码
• 14.11.htm 窗口写入的应用示例
• 14.12.htm DOM窗口交互
• 14.13.htm 窗口方法测试
• 14.14.htm 用按钮载入页面
• 14.14.htm status属性
• 14.16.htm defaultStatus属性
• 14.17.htm 滚动的状态栏
• 14.18.htm 超时设定
• 14.19.htm onload事件
• 14.20.htm 模式窗口
• 14.21.htm 无模式窗口
• 14.22.htm 窗口应用举例
• 14.23.htm 全屏窗口
第15章（\第15章）
代码说明：本章部分代码使用了第10章、第19章几个文件，如果不能正常显示，则可能这些文件位置已改变。
• 15.1.htm 简单框架
• frames.htm 网页框架
• moreframes.htm 更多框架
• moreframes.htm 框架关联显示
• 15.5.htm 简单的框架网页
• 15.6.htm 内联框架
• 15.7.htm 简单的框架嵌套
• 15.8.htm 框架嵌套
• 15.9.htm 交叉框架通信
• input.htm 交叉框架通信的输入部分
• output.htm 交叉框架通信的输出部分
• 15.12.htm 嵌套框架交叉通信
• top.htm 嵌套框架交叉通信的上部框架
• bottom.htm 嵌套框架交叉通信的底部框架
• minput.htm 嵌套框架交叉通信的输入部分
• moutput.htm 嵌套框架交叉通信的输出部分
• stateframes.htm 状态框架集
• stateframe.htm 状态框架
• mainframe.htm 主框架
• mainframe2.htm 主框架之二
第16章（\第16章）
• 16.1.htm 文档颜色属性应用
• 16.2.htm lastModified
• 16.3.htm lastModified的返回值
• 16.4.htm document.location
• 16.6.htm document.location的详细属性
• 16.6.htm 验证document.referrer
• 16.7.htm 验证document.referrer
• 16.8.htm document.write()与document.writeln()
• 16.9.htm 字符串连接输出
• 16.10.htm document.close()和document.open()
• 16.11.htm document.links[].href
• 16.12.htm elements[]
• 16.13.htm images[]
• 16.14.htm document.getElementById()
• 16.15.htm document.createElement()
• 16.16.htm 设置表格属性
• 16.17.htm 显示表格属性
• 16.18.htm 操作表格元素
• 16.19.htm 插入和删除表元
• 16.20.htm 改变
的内容
• 16.21.htm 改变页面样式
• blue.css 16.21.htm用到的样式文件
• red.css 16.21.htm用到的样式文件
• green.css 16.21.htm用到的样式文件
第17章（\第17章）
• 17.1.htm Form对象测试
• 17.2.htm 基本按钮
• 17.3.htm button按钮
• 17.4.htm 文本域
• 17.5.htm 文本区
• 17.6.htm 限制输入长度的文本区
• 17.7.htm 限制输入长度的文本区之二
• 17.8.htm 复选框与单选按钮
• 17.9.htm 验证输入内容是否为空
• 17.10.htm 验证输入内容是否为空
• 17.11.htm 混合表单验证
• 17.12.htm 按键屏蔽
• 17.13.htm 屏蔽表单域
• 17.14.htm 动态表单
第18章（\第18章）
• 18.1.htm 复选框
• 18.2.htm 单选按钮
• 18.3.htm 复选框与单选按钮的组合使用
• 18.4.htm 使用elements[]数组
• 18.5.htm 选择控件
• 18.6.htm 多项选择控件
• 18.7.htm 级联选择控件
第19章（\第19章）
• 19.1.htm 友情链接
• 19.2.htm 需要确认的友情链接
• 19.3.htm 渐显效果的下拉菜单
• 19.4.htm 模拟系统菜单
• 19.5.htm 图片显示窗口
• 19.6.htm 远程控制菜单
• 19.7.htm 滑动菜单
• 19.8.htm 左键弹出式菜单
• 19.9.htm 浮动菜单
• 19.10.htm 导航式菜单
第20章（\第20章）
• 20.1.htm 显示浏览器名称与版本号
• 20.2.htm 显示浏览器名称（改进章）
• 20.3.htm JavaScript支持检测1
• 20.4.htm JavaScript支持检测2
• 20.5.htm JavaScript对象检测
• 20.6.htm Screen对象
• 20.7.htm 获取浏览器窗口大小
• 20.8.htm 字号随浏览器窗口大小而改变
• 20.9.htm 对代码20.8的改写
• 20.10.htm 在网页中有选择地显示图片
• 20.11.htm 客户端性能检测
• 20.12.htm 浏览器按键模拟
• 20.13.htm 修改Mozilla用户主页
• 20.14.htm 修改IE用户主页
第21章（\第21章）
• 21.1.htm 编码与解码
• 21.2.htm Cookie值被覆盖
• 21.3.htm Cookie分析
• 21.4.htm 用Cookie保存定制样式
• 21.5.htm DHTML行为
第22章（\第22章）
• 22.1.htm 通过单击按钮来改变图像
• 22.2.htm 随机显示不同图像
• 22.3.htm 结构化图形控件
• 22.4.htm 图像定位示例
• 22.5.htm 在IE中拖动图像
• 22.6.htm 按钮翻转示例
• 22.7.htm 跟随屏幕移动的图片
• 22.8.htm 多幅图片滚动显示
• 22.9.htm 图片的左右循环飘动
• 22.10.htm 图片的渐隐渐显
• 22.11.htm 不停闪烁的图片
• 22.12.htm 图片倒映
第23章（\第23章）
• 23.1.htm 简单过渡
• layerlib.js JavaScript外部文件
• 23.3.htm 目标翻转
• 23.4.htm 运动图像
• 23.5.htm 随机图像
• 23.6.htm 动画效果
• 23.7.htm Sequencer控件
• 23.8.htm Path控件
• 23.9.htm 永远居中的背景图片
• 23.10.htm 随机显示的背景图片
• 23.11.htm 垂直滚动公告板
• 23.12.htm 类似Flash的字幕效果
• 23.13.htm 地震效果
第24章（\第24章）
• MyApplet.txt 简单的Java Applet源程序
• 24.2.htm 在JavaScript中访问Java Applet
• 24.3.htm 简单的Flash插件
• 24.4.htm mimeTypes[]数组
• 24.5.htm 使用mimeTypes[]检测支持的媒体类型
• 24.6.htm 使用navigator.plugins[][]列举所有Flash MIME类型
• 24.7.htm 列举plugins[]数组的内容
• 24.8.htm 简单的Flash播放控制器
• 24.9.htm ActiveX控件示例
• 24.10.htm 使代码兼容多种浏览器
• 24.11.htm Flash 播放控制器(ActiveX)
第25章（\第25章）
• 25.1.htm 单向通信中的Image
• 25.2.htm JavaScript向服务器发送RPC
• 25.3.htm 动态内容
• 25.4.htm 中的单词拼写检查
• 25.5.htm 内联框架
第26章（\第26章）
1．查看书中图26.9的效果的方法：
用记事本打开26.5.xml，找到第二行，内容如下：
将两端的去掉并保存该文档后，用IE打开，就可看到图26.9所示的效果。
2．查看书中图26.10的效果的方法：
用记事本打开26.5.xml，找到第3行，内容如下：
将两端的去掉并保存该文档后，用IE打开，就可看到图26.9所示的效果。
3．要查看书中图26.11的效果，须连接Internet。
• 26.1.xml XML文档的例子
• 26.2.xml 包含DTD及其实例的XML文档
• 26.3.xml 要转换的XML文档
• test.xsl 转换XML文档的模板文件
• 26.5.xml 更复杂的要转换的XML文档
• staff.xsl XSL样式表
• staff.css CSS样式表
• 26.8.xml 使用了MathML的XML文档
• 26.9.htm 显示XML文档根结点
• 26.10.htm 使用Jscript与DOM直接操作XML
• 26.11.xml 使用Mozilla直接操作XML
• 26.12.js 使用Mozilla直接操作XML用到的js文件
• 26.13.htm IE XML数据岛应用
• 26.14.htm IE XML数据岛
• 26.15.rss 简单的rss文件
• 26.16.htm 简单的rss阅读器
第28章（\第28章）
• 28.1.htm 显示当前时间
• 28.2.htm 显示当前日期和星期
• 28.3.htm 显示日期、时间和星期
• 28.4.htm 分时段问候
• 28.5.htm 以数字图片来显示时间
• 28.6.htm 显示世界不同地区的当前时间
• 28.7.htm 总是悬浮的时钟
• 28.8.htm 简单的加减乘除运算
• 28.9.htm 能进行四则混合运算的计算器
• 28.10.htm 在表单中显示打字效果
• 28.11.htm 随页面刷新更换页面背景
• 28.12.htm 随页面刷新显示不同图片
第29章（\第29章）
• 29.1.htm 汉诺塔问题求解
• 29.2.htm 位置固定的对联广告
• 29.3.htm 随页面滚动的对联广告
• 29.4.htm 循环滚动的多幅广告
• css.css 代码29.4用到的样式文件
• 29.6.htm 用JavaScript实现级联选择
• ajax_server.asp 使用ASP访问demo数据表
• ajax.htm 使用ajax实现级联选择
第30章（\第30章）
代码说明：本章实现了一个ASP留言板程序，程序需要在IIS环境下运行。
• index.asp 留言板主程序
• guestbook.mdb 留言板数据库程序
• images\ 留言板使用的图像文件目录
