ajax页面数据的传递
在上一篇文章中,简单提到了ajax的工作流程,那么在这里我们就得实战一回了,真正将ajax的用途展现出来,这一整套流程就是在页面上触发一个ajax事件,然后发送请求,紧接着到数据库读取数据,返回值,然后显示在页面上,当然这个是不用刷新整个页面的当然这也就得益于ajax的异步功能了,这里不做过多的简述。
首先第一步,就是触发一个事件,这个事件当然是出现在页面上的,所谓的事件,就是用户在页面上的活动会触发某些事件,比如说点击啊,什么的,然后网页会给出一定的反应,这就是事件的定义,当然在这里,当我们用户点击某个按钮,触发某个事件,当然这个事件上绑定了我们的ajax当被触发以后,就执行我们前一章节简述的ajax工作流程,发送一个ajax请求到我们的服务器,在这里,服务器的搭建有很多的,有大型的,比如说用Java编写的安全性高的,有中小型的,比如说用php语言编写的,当然,我们这里采用node-js搭建的服务器。
当我们的监听端口监听到用户发送来的ajax请求,紧接着就会进行编译,这里我们得定义好sql语句,在这里,node-js服务器就将执行我们编译好的sql语句,以res.send(),发送到数据库,在这一步,便是执行数据库操作,将符合我们查找需要的数据找出来,在返回给我们的ajax,紧接着,ajax的response.text将带回从数据库查出来的返回值,我们通过操作javascript 的DOM属性就可以将返回值随意的放在页面上了。
在这里,不得不提一下node-js对已数据库的连接,我们的node-js是基于谷歌的v8引擎,独立运行的,基于异步非阻塞IO的一种新技术,其中的详细介绍将在后面详述,其中node-js提供了许多的核心包,这些包是通过npm包管理工具进行下载的,下载好以后,我们只需在我们的项目中引入mysql模块包就可以了,建立连接
var conn=mysql.createConnection();
紧接着就要连接我们的数据库核心包了,
var mysql=require("mysql");
var conn=mysql.createConnection({
host:"localhost" ---------->这一步的操作主要是定义是在本机上访问数据库还是远程访问;
port:3306;-------------->数据库的端口号,方便对接。
database:“test”--------->我们需要查询的那个数据库名称
user:“root”---------->我们定义好的数据库的用户名;
password:“123”------>我们定义的数据库的密码;
});
进过这几步的话,我们就基本上完成了node-js和我们mysql 的成功对接,当然我们数据库是存放数据的地方,里面不乏一些重要的数据,就像是我们的房子一样,你出门以后总不会不关门就离开了吧,忘记了的除外,所以当我们在用完数据库之后,重要的一点就是记得关闭数据库。虽然不是什么大事情,但是作为一个程序员我们必须注重细节。
其中在连接中,还有就是node-js的介绍,在这里都不是很详细,接下来我们详细介绍。
ajax页面数据的传递的更多相关文章
- AJAX 页面数据传递
$.ajax({ //一个Ajax过程 type: "post", //以post方式与后台沟通 url: "personstockajax.php", //与 ...
- vue ajax获取数据的时候,如何保证传递参数的安全或者说如何保护api的安全
https://segmentfault.com/q/1010000005618139 vue ajax获取数据的时候,如何保证传递参数的安全或者说如何保护api的安全 点击提交,发送请求.但是api ...
- form表单提交数据,页面必定会刷新,ajax提交数据不会刷新,做到悄悄提交,多选删除,ajax提交实例
很多页面用到的模态对话框,如知明网站https://dig.chouti.com/的登录页都是模态对话框, 当点登录时,是用的ajax提交,因为输入错了信息,有返回消息,而页面没有刷新. jquery ...
- vue页面之间数据的传递
vue是由一个个组件组合而成的页面,今天我们就来说一下页面之间数据的传递. 我们经常会在后台管理系统看到用户详情,有添加用户和编辑用户.有时候我们的添加和编辑是在同一页面上以模态框的形式展现的,但有的 ...
- 扩展auth_user字段、BBS需求分析、创建BBS数据库、注册页面搭建与用户头像展示及Ajax提交数据
昨日内容回顾 csrf跨站请求 1. SQL注入 2. xss攻击 3. csrf跨站请求 4. 密码加密(加盐) '''django中默认有一个中间件来验证csrf''' # 只针对post请求才验 ...
- ASP.NET MVC5中View-Controller间数据的传递
使用ASP.NET MVC做开发时,经常需要在页面(View)和控制器(Controller)之间传递数据,那么都有哪些数据传递的方式呢? 本文对于View向Controller中传值共列举了以下几种 ...
- Learning Scrapy笔记(六)- Scrapy处理JSON API和AJAX页面
摘要:介绍了使用Scrapy处理JSON API和AJAX页面的方法 有时候,你会发现你要爬取的页面并不存在HTML源码,譬如,在浏览器打开http://localhost:9312/static/, ...
- 使用服务器端控制AJAX页面缓存
你知道 response.setHeader("Cache-Control","no-cache"); 这条语句是干什么的吗? 这是用来防止浏览器缓存动态内容生 ...
- ajax大数据排队导出+进度条
描述 :我们现在有很多数据,分表存放,现在需要有精度条的导出.最后面有完整源码. 效果图:
随机推荐
- 这十大MCU厂商瓜分着中国市场
MCU(Micro Control Unit)中文名称为微控制单元,又称单片微型计算机(Single Chip Microcomputer)或者单片机,是指随着大规模集成电路的出现及其发展,将计算机的 ...
- 我的VSTO之路(二):VSTO程序基本知识
原文:我的VSTO之路(二):VSTO程序基本知识 开始之前,首先我介绍一下我的开发环境:VS2010 + Office 2010,是基于.Net framework 4.0和VSTO 4.0.以下的 ...
- 修改css
.content{ height: 100%; } .con{ border: 1px solid #eeeeee; display: inline-block; width:86.8%; ##修改这 ...
- vijos1053Easy sssp
P1053Easy sssp 描述 输入数据给出一个有N(2 <= N <= 1,000)个节点,M(M <= 100,000)条边的带权有向图. 要求你写一个程序, 判断这个有向图 ...
- 【高精度】Vijos P1010 清帝之惑之乾隆
题目链接: https://vijos.org/p/1010 题目大意: 多组数据,求R的n次幂(R为不超过9999.9的小数 n<=200)R保证占6位 不输出前导0和后缀0,整数就只输出整数 ...
- datetime和timer的使用(小小幻灯片)
一:展示图片 每秒换一次图片,一共六十张图片,00-59 二:代码 a,设计代码 namespace timePicture { partial class Form1 { /// <summa ...
- kafka在zookeeper中的存储结构
参考site:http://kafka.apache.org/documentation.html#impl_zookeeper 1.zookeeper客户端相关命令 在确保zookeeper服务启动 ...
- MVC4 中Remote的使用
相信当你看到这篇文章的时候对remote是有一些了解了, 起码知道这个东西是来干嘛用的. 这里也就不废话了 直接上代码 看看Remote的一些使用方式. 1.判断表单上输入的数据是否存在 [Syst ...
- springboot的restController使用swagger遇到的问题。
在controller中使用swagger,使用注解ApiImplicitParam遇到一个问题 当方法的参数是走path的swggerui的参数展现是正常的, @PathVariable 但如果是走 ...
- 《Mathematical Olympiad——组合数学》——操作和游戏
这篇文章,我们开始对奥数中有关操作和游戏的问题进行分析和讨论,其实在信息学竞赛中涉及到的一些博弈问题(分析必胜策略)的问题(例如巴什博弈.尼姆博弈),本质上来讲,就是组合数学当中的组合游戏,并不是真正 ...