首页 > 代码库 > node服务器获取form表单
node服务器获取form表单
搭建好服务器后
(前言,本文只是介绍form表单直接提供给 本页面数据,即在不刷新页面的前提下更改数据)
在public里面添加index.html
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <script src="node_modules/jquery/dist/jquery.min.js"></script> 7 </head> 8 <body> 9 <form method="post" action="hello">10 <label>11 name:12 <input type="text" name="name" required="required">13 </label>14 <input type="submit" value="submit">15 </form>16 <div id="result"></div>17 <script src="main.js"></script>18 </body>19 </html>
在新建个main.js
1 (function () { 2 3 $("form").on("submit", function (e) { 4 e.preventDefault(); 5 6 // console.log(this["name"].value, this.action, this.method); 7 8 $.post(this.action, {name: this["name"].value}).done(function (data) { 9 $("#result").html(data);10 }).fail(function (err) {11 alert("无法连接服务器");12 });13 });14 15 })();
在routes里面的index文件中添加如下代码
1 router.post("/hello", function (req, res) {2 res.render("hello", {name: req.body.name});3 });
再在views文件夹下添加hello.jade文件
1 html2 head3 title = "hello"4 body5 div hello #{name};
ok,运行即可
补充一下,send和render的区别
send:直接处理数据,作用:把数据传到<body>标签中,只能传来get,即传过来搜索框中的内容(处理的是直接的数据)
render:意为渲染,作用,把一个文件渲染后,传到<body>标签中,使用post处理过得数据,传送给那个文件,后在传到<body>标签中。(处理的是文件)
node服务器获取form表单
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。