浅谈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 相关文章推荐
Jquery实现Div上下移动示例
Apr 23 Javascript
jquery delay()介绍及使用指南
Sep 02 Javascript
jQuery中bind()方法用法实例
Jan 19 Javascript
JavaScript获取按钮所在form表单id的方法
Apr 02 Javascript
js实现刷新iframe的方法汇总
Apr 27 Javascript
深究AngularJS中ng-drag、ng-drop的用法
Jun 12 Javascript
Ionic3实现图片瀑布流布局
Aug 09 Javascript
node.js将MongoDB数据同步到MySQL的步骤
Dec 10 Javascript
微信小程序实现全局搜索代码高亮的示例
Mar 30 Javascript
对 Vue-Router 进行单元测试的方法
Nov 05 Javascript
JS实现继承的几种常用方式示例
Jun 22 Javascript
Jquery属性的获取/设置及样式添加/删除操作技巧分析
Dec 23 jQuery
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新手上路(十一)
2006/10/09 PHP
特转载一高手总结PHP学习资源和链接.
2006/12/05 PHP
php的一些小问题
2010/07/03 PHP
php可生成缩略图的文件上传类实例
2014/12/17 PHP
[原创]php获取数组中键值最大数组项的索引值
2015/03/17 PHP
PHP实现清除MySQL死连接的方法
2016/07/23 PHP
PHP PDOStatement::bindValue讲解
2019/01/30 PHP
js中各浏览器中鼠标按键值的差异
2011/04/07 Javascript
JavaScript 图像动画的小demo
2012/05/23 Javascript
jquery在项目中做复选框时遇到的一些问题笔记
2013/11/17 Javascript
轻松创建nodejs服务器(4):路由
2014/12/18 NodeJs
关于两个jQuery(js)特效冲突的bug的解决办法
2016/09/04 Javascript
通过BootStrap-select插件 js jQuery控制select属性变化
2017/01/03 Javascript
使用webpack搭建react开发环境的方法
2018/05/15 Javascript
vue通过滚动行为实现从列表到详情,返回列表原位置的方法
2018/08/31 Javascript
浅谈Vue.set实际上是什么
2019/10/17 Javascript
微信小程序云函数添加数据到数据库的方法
2020/03/04 Javascript
Python help()函数用法详解
2014/03/11 Python
python实现微信自动回复功能
2018/04/11 Python
Python中实现单例模式的n种方式和原理
2018/11/14 Python
python爬虫URL重试机制的实现方法(python2.7以及python3.5)
2018/12/18 Python
python之信息加密题目详解
2019/06/26 Python
Python中IP地址处理IPy模块的方法
2019/08/16 Python
keras 读取多标签图像数据方式
2020/06/12 Python
python实现逻辑回归的示例
2020/10/09 Python
Python实现淘宝秒杀功能的示例代码
2021/01/19 Python
苏宁红孩子母婴商城:redbaby
2017/02/12 全球购物
迪卡侬英国官网:Decathlon英国
2017/04/08 全球购物
致跳高运动员广播稿
2014/01/13 职场文书
大学学风建设方案
2014/05/04 职场文书
安全生产专项整治方案
2014/05/06 职场文书
大气污染防治方案
2014/05/19 职场文书
电影建国大业观后感
2015/06/01 职场文书
山楂树之恋观后感
2015/06/11 职场文书
微信小程序实现录音Record功能
2021/05/09 Javascript
spring cloud eureka 服务启动失败的原因分析及解决方法
2022/03/17 Java/Android