form表单提交的submit和ajax区别

本文涉及的产品
.cn 域名,1个 12个月
简介: 有关同源策略和跨域,可以参考 跨域的那些事儿

页面


  • submit:更新数据完成后,需要转到一个空白的页面再对原页面进行提交后的处理,即重绘。
  • ajax:异步进行,直接返回原页面进行提交后的处理,比submit少增加一个页面,即局部刷新。


安全


  • ajax:出于安全性的考虑,不能对文件进行操作,所以不可以通过ajax来实现文件上传
  • submit:通过隐藏form的submit可以实现文件上传


form默认提交


如果想要submit后不刷新页面,在该方法的最后加上 return false ,就可以了。

return false 的含义不是阻止事件继续向顶层元素传播,而是阻止浏览器对事件的默认处理方式。在js中,它的作用一般是用来取消默认动作的。

return false 等效于 window.event.returnValue = false

因为原页面用 form 提交到另一个域名之后,原页面的脚本无法获取新页面中的内容。所以浏览器认为这是安全的。而 AJAX 是可以读取响应内容的,因此浏览器不能允许你这样做。 如果你细心的话你会发现,其实请求已经发送出去了,你只是拿不到响应而已。 所以浏览器这个策略的本质是,一个域名的 JS ,在未经允许的情况下,不得读取另一个域名的内容。但浏览器并不阻止你向另一个域名发送请求。 ——来自知乎

有关同源策略和跨域,可以参考 跨域的那些事儿

目录
相关文章
|
7月前
|
负载均衡 前端开发 搜索推荐
Axios 和 Ajax 的区别
Axios 和 Ajax 的区别
|
前端开发 安全
ajax请求的时候get 和post方式的区别
ajax请求的时候get 和post方式的区别
|
1月前
|
XML 前端开发 JavaScript
webSocket 和 ajax 的区别
【10月更文挑战第26天】在实际开发中,需要根据具体的应用需求来选择合适的技术,以实现最佳的用户体验和系统性能。
|
6月前
|
前端开发 JavaScript
杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]
杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]
50 0
杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]
|
2月前
|
XML 前端开发 JavaScript
详解Ajax与axios的区别
详解Ajax与axios的区别
|
4月前
|
XML JSON 前端开发
AJAX是什么?原生语法格式?jQuery提供分装好的AJAX有什么区别?
AJAX是什么?原生语法格式?jQuery提供分装好的AJAX有什么区别?
35 0
|
6月前
|
JSON 前端开发 JavaScript
前端Ajax、Axios和Fetch的用法和区别笔记
前端Ajax、Axios和Fetch的用法和区别笔记
112 2
|
6月前
|
XML 缓存 前端开发
AJAX中get和post的区别
AJAX中get和post的区别
65 0
|
6月前
1.ajax同步和异步区别 2.post和get区别
1.ajax同步和异步区别 2.post和get区别
32 0
|
7月前
|
XML 前端开发 JavaScript
CSR和 AJAX有什么区别
CSR和 AJAX有什么区别
67 1