浅谈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 相关文章推荐
ExtJS 2.0 实用简明教程之布局概述
Apr 29 Javascript
js jq 单击和双击区分示例介绍
Nov 05 Javascript
js+html5实现可在手机上玩的拼图游戏
Jul 17 Javascript
Javascript类型转换的规则实例解析
Feb 23 Javascript
深入理解jQuery中的事件冒泡
May 24 Javascript
jQuery原理系列-常用Dom操作详解
Jun 07 Javascript
详解Vue2.0里过滤器容易踩到的坑
Jun 01 Javascript
javascript中mouseenter与mouseover的异同
Jun 06 Javascript
jQuery实现菜单栏导航效果
Aug 15 jQuery
jquery写出PC端轮播图实例
Jan 26 jQuery
JS基于对象的链表实现与使用方法示例
Jan 31 Javascript
解决layui table表单提示数据接口请求异常的问题
Sep 24 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和XSS跨站攻击的防范
2007/04/17 PHP
php ftp文件上传函数(基础版)
2010/06/03 PHP
使用淘宝IP库获取用户ip地理位置
2013/10/27 PHP
PHP模板引擎Smarty的缓存使用总结
2014/04/24 PHP
php检索或者复制远程文件的方法
2015/03/13 PHP
解读PHP中的垃圾回收机制
2015/08/10 PHP
Thinkphp 5.0实现微信企业付款到零钱
2018/09/30 PHP
js判断变量是否空值的代码
2008/10/26 Javascript
Jquery 高亮显示文本中重要的关键字
2009/12/24 Javascript
JavaScript跨平台的开源框架NativeScript
2015/03/24 Javascript
详解javascript中的事件处理
2015/11/06 Javascript
javascript中利用柯里化函数实现bind方法
2016/04/29 Javascript
axios学习教程全攻略
2017/03/26 Javascript
bootstrap日期控件问题(双日期、清空等问题解决)
2017/04/19 Javascript
详解jQuery中的isPlainObject()使用方法
2018/02/27 jQuery
webpack4之SplitChunksPlugin使用指南
2018/06/12 Javascript
详解基于React.js和Node.js的SSR实现方案
2019/03/21 Javascript
Vue实现导航栏菜单
2020/08/19 Javascript
JS+CSS实现动态时钟
2021/02/19 Javascript
详解Python中最难理解的点-装饰器
2017/04/03 Python
Python实现的双色球生成功能示例
2017/12/18 Python
Ubuntu下使用Python实现游戏制作中的切分图片功能
2018/03/30 Python
使用python将大量数据导出到Excel中的小技巧分享
2018/06/14 Python
python生成n个元素的全组合方法
2018/11/13 Python
Python求离散序列导数的示例
2019/07/10 Python
使用python模拟高斯分布例子
2019/12/09 Python
使用PyQt的QLabel组件实现选定目标框功能的方法示例
2020/05/19 Python
Html5游戏开发之乒乓Ping Pong游戏示例(二)
2013/01/21 HTML / CSS
中国最大的团购网站:聚划算
2016/09/21 全球购物
美国渔具店:FishUSA
2019/08/07 全球购物
简历自我评价怎么写好呢?
2014/01/04 职场文书
关于毕业的中学校园广播稿
2014/01/26 职场文书
2014普法依法治理工作总结
2014/12/18 职场文书
预备党员入党感想
2015/08/10 职场文书
go语言使用Casbin实现角色的权限控制
2021/06/26 Golang
mysql序号rownum行号实现方式
2022/12/24 MySQL