浅谈Web页面向后台提交数据的方式和选择


Posted in Javascript onSeptember 23, 2016

1、通过表单提交

这是HTML支持最传统的提交方法,需要创建表单,然后表单包含各种类型的表单元素,还要有一个提交按钮,通过提交按钮来提交到后台,这种方式提交后页面会刷新。

2、通过网页链接提交

可以在网页的链接附上需要提交的参数,当用户点击链接后,浏览器发起向链接的访问,从而也把链接附带的参数提交到后台,这种方式提交后页面也会刷新。

3、通过ajax提交

Javascript支持ajax方式创建HTTP请求,可以通过在HTML页面元素的事件处理函数中创建ajax请求,在url参数里携带所需提交的参数,从而提交到后台,这种方式提交后页面不会刷新。

在实际Web页面中,我们要根据实际用户交互的需要来选择合适的提交方式。

1、如果需要使用一些的表单类型用户输入,比如文本框、单选框、下拉框,那么可以选择第1种和第3种方式,如果希望提交后页面刷新就选第1种,如果不希望提交后页面刷新就选第3种。

2、如果不需要表单类型输入,那么可以选择第2种和第3种方式,如果希望提交后页面刷新就选第2种,如果不希望提交后页面刷新就选第3种。

如果一个表单里有需要有多个提交按钮怎么办呢?

比如一个表单里的提交按钮所指向的处理页面不同,这样由于表单在定义的时候就已经确定下表单数据的处理页面,所以单纯地在表单里放多个提交按钮是没有办法达到目的的。这就需要javascript。

首先定义一个函数:

<script language=javascript> 
function query(){ 
form.action=”query.php”; 
form.submit();} 
function update(){ 
form.action=”update.php”; 
form.submit();} 
</script>

通过javascript改变form的action属性值,这样就可以实现多提交按钮而且功能不同了,页面内代码如下:

<form name=”form” method=”post” action=”#”> 
<input type=”button” name=”query” onclick=”query();” value=”查询”> 
<input type=”button” name=”update” onclick=”update();” value=”更新”> 
</form>

以上就是小编为大家带来的浅谈Web页面向后台提交数据的方式和选择的全部内容了,希望对大家有所帮助,多多支持三水点靠木~

Javascript 相关文章推荐
JavaScript 入门·JavaScript 具有全范围的运算符
Oct 01 Javascript
JavaScript输出当前时间Unix时间戳的方法
Apr 06 Javascript
jQuery获取同级元素的简单代码
Jul 09 Javascript
jQuery仿京东商城楼梯式导航定位菜单
Jul 25 Javascript
Vue计算属性的学习笔记
Mar 22 Javascript
js时间戳与日期格式之间转换详解
Dec 11 Javascript
Vue精简版风格概述
Jan 30 Javascript
JS实现调用本地摄像头功能示例
May 18 Javascript
vue单页面在微信下只能分享落地页的解决方案
Apr 15 Javascript
原生JS利用transform实现banner的无限滚动示例代码
Jun 15 Javascript
解决Vue router-link绑定事件不生效的问题
Jul 22 Javascript
html+vue.js 实现漂亮分页功能可兼容IE
Nov 07 Javascript
Angular中使用ui router实现系统权限控制及开发遇到问题
Sep 23 #Javascript
打造自己的jQuery插件入门教程
Sep 23 #Javascript
jQuery.uploadify文件上传组件实例讲解
Sep 23 #Javascript
Bootstrap中点击按钮后变灰并显示加载中实例代码
Sep 23 #Javascript
jQuery实现边框动态效果的实例代码
Sep 23 #Javascript
BootStrap中按钮点击后被禁用按钮的最佳实现方法
Sep 23 #Javascript
jQuery ui autocomplete选择列表被Bootstrap模态窗遮挡的完美解决方法
Sep 23 #Javascript
You might like
PHP导入Excel到MySQL的方法
2011/04/23 PHP
Laravel网站打开速度优化的方法汇总
2017/07/16 PHP
php mysql PDO 查询操作的实例详解
2017/09/23 PHP
php实现的数组转xml案例分析
2019/09/28 PHP
jMessageBox 基于jQuery的窗口插件
2009/12/09 Javascript
javascript遇到html5的一些表单属性
2015/07/05 Javascript
freemarker判断对象是否为空的方法
2015/08/13 Javascript
bootstrap学习使用(导航条、下拉菜单、轮播、栅格布局等)
2016/12/01 Javascript
基于jQuery实现的查看全文功能【实用】
2016/12/11 Javascript
JavaScript实现星级评分
2017/01/12 Javascript
Angular4项目中添加i18n国际化插件ngx-translate的步骤详解
2017/07/02 Javascript
javaScript和jQuery自动加载简单代码实现方法
2017/11/24 jQuery
关于vue单文件中引用路径的处理方法
2018/01/08 Javascript
浅谈Redux中间件的实践
2018/07/27 Javascript
详解React native fetch遇到的坑
2018/08/30 Javascript
小程序从手动埋点到自动埋点的实现方法
2019/01/24 Javascript
微信小程序基于高德地图API实现天气组件(动态效果)
2020/10/22 Javascript
JS数组索引检测中的数据类型问题详解
2021/01/11 Javascript
[01:33:07]VGJ.T vs Newbee Supermajor 败者组 BO3 第一场 6.6
2018/06/07 DOTA
[02:46]完美世界DOTA2联赛PWL DAY4集锦
2020/11/03 DOTA
Django中使用group_by的方法
2015/05/26 Python
pygame实现烟雨蒙蒙下彩虹雨
2019/11/11 Python
用 Python 制作地球仪的方法
2020/04/24 Python
python实现读取类别频数数据画水平条形图案例
2020/04/24 Python
韩国著名的在线综合购物网站:Akmall
2016/08/07 全球购物
Lookfantastic西班牙官网:英国知名美妆购物网站
2018/06/13 全球购物
优秀的计算机专业求职信范文
2013/12/27 职场文书
母亲追悼会答谢词
2014/01/27 职场文书
2014年派出所工作总结
2014/11/21 职场文书
员工评语范文
2014/12/31 职场文书
分家协议书范本
2016/03/22 职场文书
go语言基础 seek光标位置os包的使用
2021/05/09 Golang
PHP实现rar解压读取扩展包小结
2021/06/03 PHP
漫画《尖帽子的魔法工坊》宣布动画化
2022/04/06 日漫
原生JS实现分页
2022/04/19 Javascript
如何Python使用re模块实现okenizer
2022/04/30 Python