原生态Ajax提交表单：需要借助XMLHttpRequest对象的open，要收通过post发送请求还要setRequsetHeader,然后把数据发送给后端，代码如下

目录结构

index.py代码

 #index.py

 #!/usr/bin/env python

 #-*- coding:utf-8 -*-

 import tornado.web

 import tornado.ioloop

 class indexHandler(tornado.web.RequestHandler):

     def get(self, *args, **kwargs):

         # ff = self.get_argument('user',None)

         # print(ff)

         self.render('login.html')

     def post(self, *args, **kwargs):

         dic = {'status': True,'message':''}

         if (self.get_argument('username') == 'alex' and

         self.get_argument('password') == ''):

          pass

         else:

             dic['status'] = False

             dic['message'] = '账号或密码不对'

         import json

         self.write(json.dumps(dic))

 settings ={'template_path':'view',

            'static_path':'static'

            }

 app = tornado.web.Application([(r"/login",indexHandler)

                                ],**settings)

 if __name__ == "__main__":

     app.listen('')

     tornado.ioloop.IOLoop.instance().start()

login.html代码

 <!--login.html-->

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Title</title>

 </head>

 <body>

     <input id="user" type="text" name="username">

     <input id="pwd" type="password" name="password">

     <!--<input type="checkbox">7天免登陆-->

     <input type="button" value="登陆" onclick="SubmitForm();">

     <script src="static/jquery-1.8.2.js"></script>

     <script>

         // xhr = null;

         // function SubmitForm() {

         //     xhr = new  XMLHttpRequest();

         //     xhr.open('POST','/login',true);

         //     xhr.onreadystatechange = func;

         //     xhr.setRequestHeader("CONTENT-TYPE", "application/x-www-form-urlencoded;")

         //     xhr.send("username="+document.getElementById('user').value+";password="+document.getElementById('pwd').value)

         // }

         // function func() {

         //       if (xhr.readyState == 4){

         //          console.log(xhr.responseText);

         //          ret = JSON.parse(xhr.responseText)

         //           alert(ret)

         //           alert(ret.status)

         //           alert(ret.message)

         //       }

         // }

         $.post('/login',{'username':'alex','password':'1233'},function (callback) {

             alert(callback)

         })

     </script>

 </body>

 </html>

向后台提交数据：通过form表单提交数据需刷新网页 但通过Ajax提交数据不用刷新网页可通过原生态Ajax或jqueryAjax。Ajax代码部分的更多相关文章

  1. 如何把整张表格的数据通过form表单的方式传回后台

    开发背景: 前段时间遇到这么一个需求,就是把一整张表格的数据存储在数据库中,之后再渲染在页面中,还可以进行重新编辑. 例如下边的课程表(为了方便,所以都是软件工程). 我也是经过一段时间的思考,才实现 ...

  2. 结合Bootbox将后台JSON数据填充Form表单

    本文介绍了如何结合Bootbox将后台JSON数据填充到Form表单中,同时也介绍了一些需要使用的知识的学习途径,并附上了参考文档地址与学习网址,对此感兴趣的伙伴可以直接访问学习.为了方便介绍,使用了 ...

  3. django 使用form组件提交数据之form表单提交

    django的form组件可以减少后台在进行一些重复性的验证工作,极大降低开发效率. 最近遇到一个问题: 当使用form表单提交数据后,如果数据格式不符合后台定义的规则,需要重新在前端页面填写数据. ...

  4. jquery获取form表单内容以及绑定数据到form表单

    在日常开发的过程中,难免会用到form表单,我们需要获取表单的数据保存到数据库,或者拿到后台的一串json数据,要将数据绑定到form表单上,这里我写了一个基于jquery的,formHelp插件,使 ...

  5. 表单提交中记得form表单放到table外面

    帝国后台按栏目搜索文章时怎么都不生效  控制台查看原来是 栏目的select的值没有提交过去,原来由于form标签在table标签里面,导致js生成的<select>标签提交失败. 解决办 ...

  6. layui form表单 input输入框获取焦点后 阻止Enter回车自动提交

    最简单的解决办法,不影响其他操作,给提交按钮增加 type="button" 属性 完美解决 <button type="button" class=&q ...

  7. form表单，登录用户，密码，按钮，提交、重置

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. js中大数据量form表单卡顿问题解决

    转载大神: http://www.mamicode.com/info-detail-1773696.html

  9. 关于AJAX与form表单提交数据的格式

    一 form表单传输文件的格式: 只有三种: multipart/form-data 一般用于传输文件,图片文件或者其他的. 那么其中我们默认的是application/x-www-form-urle ...

  10. form表单提交数据编码方式和tomcat接受数据解码方式的思考

    http://blog.sina.com.cn/s/blog_95c8f1ac010198j2.html *********************************************** ...

随机推荐

  1. ProgressDialog修改TextView的TextSize

    ProgressDialog修改TextView的TextSize 问题描述 今天UI过来找我说是加载条的字号太小了,不好看,希望可以改一下,然后我就研究一下如何修改ProgressDialog里面T ...

  2. 简介 - SAFe（Scaled Agile Framework，规模化敏捷框架）

    简介 SAFe(Scaled Agile Framework,规模化敏捷框架) SAFe:https://www.scaledagileframework.com/ Scaled Agile Fram ...

  3. 纯手写SpringMVC框架，用注解实现springmvc过程

    闲话不多说,直接上代码! 1.第一步,首先搭建如下架构,其中,annotation中放置自己编写的注解,主要包括service controller qualifier RequestMapping ...

  4. “五年经验”年薪50W分享Java程序员掌握什么技术才不会被淘汰

    在这个IT系统动辄就是上亿流量的时代,Java作为大数据时代应用最广泛的语言,诞生了一批又一批的新技术,包括HBase.Hadoop.MQ.Netty.SpringCloud等等 . 一些独角兽公司以 ...

  5. 关于git 指令

    命令行操作(由于是Linux命令行下的普通用户,都是在$级别下操作): 一. 本机配置 添加用户 git config –global user.name “XX” git config –gloab ...

  6. 课程回顾-Structuring Machine Learning Projects

    正交化 Orthogonalization单一评价指标保证训练.验证.测试的数据分布一致不同的错误错误分析数据分布不一致迁移学习 transfer learning多任务学习 Multi-task l ...

  7. 浅尝Spring Cloud Sleuth

    Spring Cloud Sleuth提供了分布式追踪(distributed tracing)的一个解决方案.其基本思路是在服务调用的请求和响应中加入ID,标明上下游请求的关系.利用这些信息,可以方 ...

  8. JwtBearer认证

    ASP.NET Core 认证与授权[4]:JwtBearer认证   在现代Web应用程序中,通常会使用Web, WebApp, NativeApp等多种呈现方式,而后端也由以前的Razor渲染HT ...

  9. TensorflowSharp安装和使用入门

    Tensorflow是一个人工智能框架.TensorflowSharp是对Tensorflow C语言版接口的封装,便于C#开发人员在项目中使用Tensorflow. 一.使用方法 Tensorflo ...

  10. PEB标记反调试方法

    PEB标记反调试方法 一丶PEB结构简介 PEB.简称进程环境快. 我们在讲DLL隐藏的时候已经说过了. 具体博客链接: https://www.cnblogs.com/iBinary/p/96018 ...