node服务器获取form表单
搭建好服务器后
(前言,本文只是介绍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表单的更多相关文章
- serialize可以获取form表单里面的数值
serialize属性 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...
- java:JavaScript2:(setTimeout定时器,history.go()前进/后退,navigator.userAgent判断浏览器,location.href,五种方法获取标签属性,setAttribute,innerHTML,三种方法获取form表单信息,JS表单验证,DOM对象,form表单操作)
1.open,setTimeout,setInterval,clearInterval,clearTimeout <!DOCTYPE> <html> <head> ...
- 5 获取Form表单取值
#form表达提交@app.route("/data",methods=['GET','POST']) #methods 让当前路由支持GET 和 POST 方式def data( ...
- jquery获取form表单内容以及绑定数据到form表单
在日常开发的过程中,难免会用到form表单,我们需要获取表单的数据保存到数据库,或者拿到后台的一串json数据,要将数据绑定到form表单上,这里我写了一个基于jquery的,formHelp插件,使 ...
- JS获取form表单数据
以下代码可放在一个js文件中,以便通用: //获取指定表单中指定标签对象 function getElements(formId, label) { var form = document.getEl ...
- 通过脚本获取form表单的数值而不是submit
jQuery的serialize()方法通过序列化表单值,创建URL编码文本字符串,我们就可以选择一个或多个表单元素,也可以直接选择form将其序列化,如: <form action=" ...
- 3..jquery的ajax获取form表单数据
jq是对dom进行的再次封装.是一个js库,极大简化了js使用 jquery库在js文件中,包含了所有jquery函数,引用:<script src="jquery-1.11.1.mi ...
- 获取form表单默认提交的返回值
1.经常用form表单提交的小伙伴有没有发现,form表单默认的提交是没有返回值的,而且默认提交成功之后是跳转,跳转的action的路径,下面写一下默认的提交如何获取到form表单的返回值json,并 ...
- html基础:jquery的ajax获取form表单数据
jq是对dom进行的再次封装.是一个js库,极大简化了js使用 jquery库在js文件中,包含了所有jquery函数,引用:<script src="jquery-1.11.1.mi ...
随机推荐
- MyBatis的返回参数类型和查询结果遍历
MyBatis的返回参数类型分两种 1. 对应的分类为: 1.1.resultMap: 1.2.resultType: 2 .对应返回值类型: 2.1.resultMap:结果集 2.2.result ...
- C#For循环
for循环基本格式 for(初始条件;循环条件;状态改变) { 循环体 } 1.小明单位发了100元的购物卡,小明到超市买三类洗化用品,洗发水(15元),香皂(2元),牙刷(5元).要把100元整好花 ...
- ios runtime的相关知识
一.iOS runtime原理 对于runtime机制,在网上找到的资料大概就是怎么去用这些东西,以及查看runtime.h头文件中的实现,当然这确实是一种很好的学习方法,但是,其实我们还是不会知道r ...
- libreoffice实现WORD文档转PDF文档
一.安装LibreOffice 官网:http://www.libreoffice.org/ 二.CentOS安装yum yum install libreoffice 三.执行转换命令 libreo ...
- CPU的一些参数和排名
排名的信息来源: http://itianti.sinaapp.com/index.php/cpu 一些参数的信息来源: http://ark.intel.com/ 个人关注一些的一些CPU排名: I ...
- 统计fastq文件中读段的数量
mycount=`cat SRR108114_new_1.fastq | wc -l` echo 'Number of clean reads, SRR108114_new_1.fastq: '$(( ...
- MyBatis 多表联合查询及优化 以及自定义返回结果集
下面就来说一下 mybatis 是通过什么来实现多表联合查询的.首先看一下表关系,如图: 这 里,我已经搭好了开发的环境,用到的是 SpringMVC + Spring + MyBatis,当然,为了 ...
- 2016.3.22考试(HNOI难度)
T1 盾盾的打字机 盾盾有一个非常有意思的打字机,现在盾哥要用这台打字机来打出一段文章. 由于有了上次的经验,盾盾预先准备好了一段模板A存在了内存中,并以此为基础来打出文章B.盾盾每次操作可以将内存中 ...
- [原]五分钟搭建gitserver
本来在忙一些事情,结果刚才突然收到一个临时的事情,号称很着急. 问了一下,原来是需要在本地搭建一个git库,但其实之前我是有做过gitserver的,不过是在阿里云(部分分布在青云)上,而且目前在使用 ...
- POJ-2175 Evacuation Plan 最小费用流、负环判定
题意:给定一个最小费用流的模型,根据给定的数据判定是否为最优解,如果不为最优解则给出一个比给定更优的解即可.不需要得出最优解. 解法:由给定的数据能够得出一个残图,且这个图满足了最大流的性质,判定一个 ...