浅谈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 相关文章推荐
Ajax一统天下之Dojo整合篇
Mar 24 Javascript
基于jQuery的动态表格插件
Mar 28 Javascript
javascript开发技术大全-第3章 js数据类型
Jul 03 Javascript
js字符串的各种格式的转换 ToString,Format
Aug 08 Javascript
基于jquery &amp; json的省市区联动代码
Jun 26 Javascript
在JavaScript中操作时间之setYear()方法的使用
Jun 12 Javascript
jquery 仿锚点跳转到页面指定位置的实例
Feb 14 Javascript
vue2.0实现前端星星评分功能组件实例代码
Feb 12 Javascript
echarts整合多个类似option的方法实例
Jul 10 Javascript
Vue.js 事件修饰符的使用教程
Nov 01 Javascript
详解单页面路由工程使用微信分享及二次分享解决方案
Feb 22 Javascript
vue 解决数组赋值无法渲染在页面的问题
Oct 28 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
默默简单的写了一个模板引擎
2007/01/02 PHP
Smarty中常用变量操作符汇总
2014/10/27 PHP
php第一次无法获取cookie问题处理
2014/12/15 PHP
PHP中把数据库查询结果输出为json格式简单实例
2015/04/09 PHP
PHP处理postfix邮件内容的方法
2015/06/16 PHP
php 把数字转换成汉字的代码
2015/07/21 PHP
PHP中Notice错误常见解决方法
2017/04/28 PHP
php curl获取https页面内容,不直接输出返回结果的设置方法
2019/01/15 PHP
用于判断用户注册时,密码强度的JS代码
2009/01/01 Javascript
javascript 避免闭包引发的问题
2009/03/17 Javascript
Javascript合并表格中具有相同内容单元格示例
2013/08/11 Javascript
jQuery插件AjaxFileUpload实现ajax文件上传
2016/05/05 Javascript
AngularJS中$injector、$rootScope和$scope的概念和关联关系深入分析
2017/01/19 Javascript
vue结合element-ui使用示例
2019/01/24 Javascript
Vue.extend实现挂载到实例上的方法
2019/05/01 Javascript
浅谈webpack 四个核心概念之Entry
2019/06/12 Javascript
Vue父子传递实例讲解
2020/02/14 Javascript
vue双击事件2.0事件监听(点击-双击-鼠标事件)和事件修饰符操作
2020/07/27 Javascript
关于Js中new操作符的作用详解
2021/02/21 Javascript
[02:40]DOTA2超级联赛专访430 从小就爱玩对抗性游戏
2013/06/18 DOTA
[06:44]2018DOTA2亚洲邀请赛4.5 SOLO赛 MidOne vs Sumail
2018/04/06 DOTA
[01:35]2018年度CS GO最佳战队-完美盛典
2018/12/17 DOTA
Python编程入门的一些基本知识
2015/05/13 Python
python3使用pyqt5制作一个超简单浏览器的实例
2017/10/19 Python
Python脚本利用adb进行手机控制的方法
2019/07/08 Python
Python 实现遥感影像波段组合的示例代码
2019/08/04 Python
python3.7调试的实例方法
2020/07/21 Python
python通用数据库操作工具 pydbclib的使用简介
2020/12/21 Python
Sam’s Club山姆会员商店:沃尔玛旗下高端会员制商店
2017/01/16 全球购物
大专生简历的自我评价
2013/11/26 职场文书
优秀少先队辅导员先进事迹材料
2014/05/18 职场文书
大学团日活动新闻稿
2014/09/10 职场文书
先进党组织事迹材料
2014/12/26 职场文书
九寨沟导游词
2015/02/02 职场文书
关于考试抄袭的检讨书
2019/11/02 职场文书
MySQL官方导出工具mysqlpump的使用
2021/05/21 MySQL