【文章来源】由于自己对于form研究甚少,所以一直用的都是AJAX进行提交,这次后台提出要用form提交,顺便深入研究一下;之前在做表单的时候,发现input可以通过设置不同的type属性,调用不同的移动端软键盘,但是对于软键盘中的【搜索】和【前往】不知道怎么进行控制

【form 和 ajax 区别】

Ajax提交是通过js来提交请求,请求与响应均由js引擎来处理,页面不会刷新,用户感觉不到实际上浏览器发出了请求。如我们想要改变页面局部内容的时候,使用Ajax进行刷新不会引起整体页面重新加载的现象,交互良好

使用AJAX,用户对Web的体验会更“敏捷”:数据提交页面不会闪屏;页面局部更新速度快;网络带宽占用低。

AJAX开发相较传统模式的简单之处:传统模式下,表单提交则整个页面重绘,为了维持页面用户对表单的状态改变,要多些不少代码。 要在控制器和模板之间传递更多参数以保持页面状态。而AJAX不然,因为页面只是局部更新, 不关心也不会影响页面其他部分的内容。

AJAX开发相较传统模式的难度:需要了解、精通JavaScript,而JavaScript存在调试麻烦、浏览器兼容性等很多障碍。不过这方面目前来看早已不是什么难点了

【1】Ajax在提交、请求、接收时,都是异步进行的,网页不需要刷新;
Form提交则是新建一个页面,哪怕是提交给自己本身的页面,也是需要刷新的;
【2】Ajax在提交时,是在后台新建一个请求;
Form却是放弃本页面,而后再请求;
【3】Ajax必须要使用JS来实现,不启用JS的浏览器,无法完成该操作;
Form却是浏览器的本能,无论是否开启JS,都可以提交表单;
【4】Ajax在提交、请求、接收时,整个过程都需要使用程序来对其数据进行处理;
Form提交时,却是根据你的表单结构自动完成,不需要代码干预;

【关于调用软键盘问题】

目前经过测试使用传统的form提交,软键盘可以进行调用,功能和直接点击提交时一样的。值得注意的是,点击软键盘可以进行提交表单操作,但对于表单中提交按钮本身不会进行触发,也就是点击软键盘【搜索】或【前往】不会触发【提交按钮】点击事件

Ajax目前还没有找到如何调用软键盘的方法

【input属性type2016年12月7日亲自测试总结】

属性为 == email ==,调用邮件软键盘

属性为 == url ==,调用网址软键盘

属性为 == search ==,调用带有【搜索】按钮的软键盘

属性为 == tel ==,调用全数字键盘

属性为 == number ==,调用带有拼音的数字软键盘

总结:这部分属于笔记记录方便我个人即使查看

form表单提交和ajax表单提交,关于移动端如何通过软键盘上的【搜索】和【前进】进行提交操作的更多相关文章

  1. 第一百八十六节,jQuery,验证表单插件,Ajax 表单插件,验证和提交表单

    jQuery,验证表单插件,Ajax 表单插件,验证和提交表单 HTML <form id="reg" method="post" action=&quo ...

  2. 表单在ios下输入框必须重压或长按才能唤起软键盘

    解决方案: 一.在node_module里找到fastClick文件,然后找到focus方法,加一句focus方法即可解决:FastClick.prototype.focus = function(t ...

  3. 使用ajax提交form表单,包括ajax文件上传

    前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },"json"); 又或者是这样的aja ...

  4. form表单和ajax表单提交(Html.BeginForm()、Ajax.BeginForm())的差别

    有如下几种区别: 1. Ajax在提交.请求.接收时,都是异步进行的,网页不需要刷新: Form提交则是新建一个页面,哪怕是提交给自己本身的页面,也是需要刷新的: 2. A在提交时,是在后台新建一个请 ...

  5. Ajax表单提交插件jquery form

    jQuery Form插件是一个优秀的Ajax表单插件,我们可以非常容易的使用它处理表单控件的值,清空和复位表单控件,附件上传,以及完成Ajax表单提交. jQuery Form有两个核心方法ajax ...

  6. Form表单提交,Ajax请求,$http请求的区别

    做过前端同学想必都避免不了要和后台server打交道.而以下这三种与后台交互的方式想必大家都不陌生. Form表单提交,Ajax请求,Angular的$http请求 以前一直搞不清楚什么时候应该用哪种 ...

  7. 使用ajax提交form表单,包括ajax文件上传【转载】

    [使用ajax提交form表单,包括ajax文件上传] 前言 转载:作者:https://www.cnblogs.com/zhuxiaojie/p/4783939.html 使用ajax请求数据,很多 ...

  8. 使用ajax提交form表单,包括ajax文件上传 转http://www.cnblogs.com/zhuxiaojie/p/4783939.html

    使用ajax提交form表单,包括ajax文件上传 前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },&qu ...

  9. jquery.form.js(ajax表单提交)

    Form插件地址: 官方网站:http://malsup.com/jQuery/form/ 翻译地址:http://www.aqee.net/docs/jquery.form.plugin/jquer ...

随机推荐

  1. SSRS1:配置SMTP Server发送mail

    为了使用SSRS发送mail,必须为Reporting service配置SMTP Server. 1,在Reporting Service Configuration Manager中配置Email ...

  2. ASP.NET MVC5 网站开发实践 - 概述

    前段时间一直在用MVC4写个网站开发的demo,由于刚开始学所有的代码都写在一个项目中,越写越混乱,到后来有些代码自己都理不清了.1月26日晚上在群里跟@怒放 他们讨论这个问题,结论是即使只是一个小d ...

  3. 创建第一个 local network(I) - 每天5分钟玩转 OpenStack(80)

    在 ML2 配置文件中 enable local network 后,本节将开始创建第一个 local network. 我们将通过 Web GUI 创建第一个 local network. 首先确保 ...

  4. canvas学习(一)

    Canvas 学习之路 (一) canvas 是H5 里面神一样的东西,使得只是通过html和js就能做出非常棒的游戏和画面. 因为对前端无限的爱好,更加对canvas充满好奇,将我学习canvas的 ...

  5. ZOJ Problem Set - 1240 IBM Minus One

    水题不解释,就是注意下格式,没输出一行字符串记得加一个空白行 #include <stdio.h> #include <string.h> int main() { ; ]; ...

  6. chrome扩展程序开发

    首先,明确两个概念的区别:chrome扩展程序和Web Apps.具体参考:http://www.chromi.org/archives/10106 本文只讨论chrome扩展程序. 最好的开发教程莫 ...

  7. git取消跟踪文件

    取消跟踪文件: $git rm --cached FILENAME 取消跟踪目录: $git rm --cached FILENAME -r

  8. 细说Cookie

    阅读目录 开始 Cookie 概述 Cookie的写.读过程 使用Cookie保存复杂对象 Js中读写Cookie Cookie在Session中的应用 Cookie在身份验证中的应用 Cookie的 ...

  9. Dapper简明教程

    Dapper是一款轻量级的ORM框架,有关Dapper优缺点的文章网上一大堆,这里小编就不再赘述啦.下面直接进入正题: 使用前准备 添加对Dapper的引用 在使用Dapper之前,我们要首先添加对D ...

  10. 我对Backbone.js的一些认识

    backbone.js已经不是当前最流行的前端框架了,但是对于我而言,依然具有比较好的学习价值.虽然目前来说,react,vue等mvvm框架非常火热,但是感觉自身还不到去使用这种框架的层次.这些技术 ...