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

 更新时间:2016年09月23日 17:51:52   投稿:jingxian  
下面小编就为大家带来一篇浅谈Web页面向后台提交数据的方式和选择。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

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数组的用法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • 最实用的JS数组函数整理

    最实用的JS数组函数整理

    本篇文章小编给大家整理了非常全的JS数组函数以及相关的写法规则,希望能够对读者们起到帮助和参考。
    2017-12-12
  • javascript 实现 原路返回

    javascript 实现 原路返回

    这篇文章主要介绍了javascript 实现原路返回的方法,需要的朋友可以参考下
    2015-01-01
  • 浅谈JavaScript Array对象

    浅谈JavaScript Array对象

    这篇文章主要介绍了JavaScript Array对象的相关资料,需要的朋友可以参考下
    2014-12-12
  • JavaScript运行时库属性一览表

    JavaScript运行时库属性一览表

    这篇文章主要介绍了JavaScript运行时库属性,需要的朋友可以参考下
    2014-03-03
  • 浅谈JavaScript中的字符编码转换问题

    浅谈JavaScript中的字符编码转换问题

    这篇文章主要介绍了浅谈JavaScript中的字符编码转换问题,是JS入门学习中的基础知识,需要的朋友可以参考下
    2015-07-07
  • javascript函数声明和函数表达式区别分析

    javascript函数声明和函数表达式区别分析

    本文向大家展示了javascript中函数声明和函数表达式的概念及区别,介绍的非常全面,也很详尽,这里推荐给大家
    2014-12-12
  • 使用 stylelint检查CSS_StyleLint

    使用 stylelint检查CSS_StyleLint

    你需要一个防止错误产生的机器,可以理解CSS并且理解你:你的意图、喜好、主意以及弱点。 只要是它可以阻止的错误它都会持续阻止。同时,你和你的同事可以一直改善机器,扩展它的功能并且削弱其局限性。
    2016-04-04
  • 浅析JavaScript中的事件机制

    浅析JavaScript中的事件机制

    这篇文章主要介绍了JavaScript中的事件机制,即JS与HTML的一般交互,需要的朋友可以参考下
    2015-06-06
  • javascript中神奇的 Date对象小结

    javascript中神奇的 Date对象小结

    日常生活中,各种形式的时间字符到处都是。时间观念的产生,时间单位、计时工具的发明,给人类带来的变化实在一言难尽。今天就来谈谈日期那些事儿。一起来看看 JavaScript 中的日期对象 Date。
    2017-10-10

最新评论