搭建好服务器后

（前言，本文只是介绍form表单直接提供给 本页面数据，即在不刷新页面的前提下更改数据）

在public里面添加index.html

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Title</title>

     <script src="node_modules/jquery/dist/jquery.min.js"></script>

 </head>

 <body>

 <form method="post" action="hello">

     <label>

         name:

         <input type="text" name="name" required="required">

     </label>

     <input type="submit" value="submit">

 </form>

 <div id="result"></div>

 <script src="main.js"></script>

 </body>

 </html>

在新建个main.js

 (function () {

     $("form").on("submit", function (e) {

         e.preventDefault();

         // console.log(this["name"].value, this.action, this.method);

         $.post(this.action, {name: this["name"].value}).done(function (data) {

             $("#result").html(data);

         }).fail(function (err) {

             alert("无法连接服务器");

         });

     });

 })();

在routes里面的index文件中添加如下代码

 router.post("/hello", function (req, res) {

   res.render("hello", {name: req.body.name});

 });

再在views文件夹下添加hello.jade文件

 html

     head

     title = "hello"

     body

         div hello #{name};

ok,运行即可

补充一下，send和render的区别

　　send:直接处理数据，作用：把数据传到<body>标签中，只能传来get,即传过来搜索框中的内容（处理的是直接的数据）

　　render:意为渲染，作用，把一个文件渲染后，传到<body>标签中，使用post处理过得数据，传送给那个文件，后在传到<body>标签中。（处理的是文件）

node服务器获取form表单的更多相关文章

  1. serialize可以获取form表单里面的数值

    serialize属性 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  2. java：JavaScript2：（setTimeout定时器，history.go()前进/后退，navigator.userAgent判断浏览器，location.href，五种方法获取标签属性，setAttribute，innerHTML，三种方法获取form表单信息，JS表单验证，DOM对象，form表单操作）

    1.open,setTimeout,setInterval,clearInterval,clearTimeout <!DOCTYPE> <html> <head> ...

  3. 5 获取Form表单取值

    #form表达提交@app.route("/data",methods=['GET','POST']) #methods 让当前路由支持GET 和 POST 方式def data( ...

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

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

  5. JS获取form表单数据

    以下代码可放在一个js文件中,以便通用: //获取指定表单中指定标签对象 function getElements(formId, label) { var form = document.getEl ...

  6. 通过脚本获取form表单的数值而不是submit

    jQuery的serialize()方法通过序列化表单值,创建URL编码文本字符串,我们就可以选择一个或多个表单元素,也可以直接选择form将其序列化,如: <form action=" ...

  7. 3..jquery的ajax获取form表单数据

    jq是对dom进行的再次封装.是一个js库,极大简化了js使用 jquery库在js文件中,包含了所有jquery函数,引用:<script src="jquery-1.11.1.mi ...

  8. 获取form表单默认提交的返回值

    1.经常用form表单提交的小伙伴有没有发现,form表单默认的提交是没有返回值的,而且默认提交成功之后是跳转,跳转的action的路径,下面写一下默认的提交如何获取到form表单的返回值json,并 ...

  9. html基础：jquery的ajax获取form表单数据

    jq是对dom进行的再次封装.是一个js库,极大简化了js使用 jquery库在js文件中,包含了所有jquery函数,引用:<script src="jquery-1.11.1.mi ...

随机推荐

  1. Linux运行变量中的命名脚本

    single="ls -l" $single ============= multi="ls -l | grep e" echo $multi > tmp ...

  2. 【转+自己研究】新姿势之Docker Remote API未授权访问漏洞分析和利用

    0x00 概述 最近提交了一些关于 docker remote api 未授权访问导致代码泄露.获取服务器root权限的漏洞,造成的影响都比较严重,比如 新姿势之获取果壳全站代码和多台机器root权限 ...

  3. Tomcat源码导入Eclipse测试

    想要研究下Tomcat的体系结构或者源码,最好将Tomcat的源码导入到ide中,编写实例进行代码跟踪(debug). 这里参考了网上一些资料,将自己操作过程记个流水账. 准备: 1.Tomcat源码 ...

  4. Verify an App Store Transaction Receipt 【苹果服务端 验证一个应用程序商店交易收据有效性】

    转自:http://blog.csdn.net/saindy5828/article/details/6414014 1. 从Transaction 的TransactionReceipt属性中得到接 ...

  5. ubuntu1604安装体验

    昨天安装了ubuntu 16 安装成了双系统,这样的速度才能接受. 各种软件支持的都还算不错.除了启动时候原始的气息,启动之后挺稳定的. 最让人开心的是新的unity的设置更加丰富了,可以自动隐藏,更 ...

  6. Python标准库之Sys模块使用详解

    sys 模块提供了许多函数和变量来处理 Python 运行时环境的不同部分. 处理命令行参数 在解释器启动后, argv 列表包含了传递给脚本的所有参数, 列表的第一个元素为脚本自身的名称. 使用sy ...

  7. Redis基础知识之—— 5个必须了解的事情【★★★★★】

    一.掌控储存在Redis中的所有键 数据库的主要功能是储存数据,但是对于开发者来说,因为应用程序需求或者数据使用方法的改变,忽略存储在数据库中的某些数据是非常正常的,在Redis中同样如此.你可能忽视 ...

  8. HIHO线段树(成段)

    #include <stdio.h> #define lson l,mid,id<<1 #define rson mid+1,r,id<<1|1 ; ],lazy[ ...

  9. [转载] 高效MacBook工作环境配置

    原文: http://www.xialeizhou.com/?p=71 高效MacBook工作环境配置 发表于 2015 年 8 月 1 日 由 xialeizhou 本文记录整个配置过程,供新入手M ...

  10. 排序算法 & 迷宫的深度, 广度优先

    内容提要 1. 我掌握的排序算法的时间复杂度 2. 我掌握的6种排序算法(插入, 冒泡, 选择, 归并, 快速, 希尔) 3. 迷宫的搜索方法(深度优先 + 广度优先) 各种排序的时间复杂度 名称 稳 ...