原生态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. Android 音视频开发(二)：使用 AudioRecord 采集音频PCM并保存到文件

    版权声明:转载请说明出处:http://www.cnblogs.com/renhui/p/7457321.html 一.AudioRecord API详解 AudioRecord是Android系统提 ...

  2. Java 中的锁机制

    多个进程或线程同时(或着说在同一段时间内)访问同一资源会产生并发(线程安全)问题.解决并发问题可以用锁. java的内置锁: 每个java对象都可以用做一个实现同步的锁,这些锁称为内置锁.线程进入同步 ...

  3. 第62节:探索Java中的网络编程技术

    前言 感谢! 承蒙关照~ 探索Java中的网络编程技术 网络编程就是io技术和网络技术的结合,网络模型的定义,只要共用网络模型就可以两者连接.网络模型参考. 一座塔有七层,我们需要闯关. 第一层物理层 ...

  4. 提纲挈领webrtc音频处理算法之写在前面的话

    最近工作用到了webrtc,发现webrtc是个宝库,里面有很多东西值得好好研究. 搜了这方面不少资料,发现介绍使用webrtc的不少,但是针对里面一些算法研究的 不多.特别是能把算法说的简洁明了的更 ...

  5. JavaScript的屏幕输出及时间函数

    Js屏幕输出 重定向页面输出: 更改输出流,如果在加载时使用则会正常排序,如果在HTML加载完成后使用,如点击事件,则会全部覆盖原HTML的内容. 1 <script> 2 //参数为输出 ...

  6. 【Spark调优】内存模型与参数调优

    [Spark内存模型] Spark在一个executor中的内存分为3块:storage内存.execution内存.other内存. 1. storage内存:存储broadcast,cache,p ...

  7. git push 时发生 error: failed to push some refs to 错误 （解决办法）

    出现问题的原因:在github上更新了README.md,没有更新到本地仓库.而在本地git仓库又修改了文件,这时使用 git push origin master 推送到远程仓库后就出现了下面的问题 ...

  8. 从零開始学Xamarin.Forms(一) 概述

        Xamarin 读 "ˈzæmərin",是一个基于开源项目mono的可以使用C#开发的收费的跨平台(iOS.Android.Windows Phone.Mac)解决方式. ...

  9. Eclipse报错:!!MESSAGE Job found still running.......

    !ENTRY org.eclipse.core.jobs 2 2 2014-01-08 09:28:06.387 !MESSAGE Job found still running after plat ...

  10. Chapter 4 Invitations——9

    I didn't want to get into the safety hazards that dancing presented, so I quickly made new plans. 我不 ...