当前位置：首页 > 资讯 > 技术文档

ajax方式实现注册功能(提交数据到后台数据库完成交互)

时间：2021-08-13 08:18 编辑：来源：阅读：
扫一扫，手机访问

摘要：ajax方式实现注册功能(提交数据到后台数据库完成交互)

一、当我们在验证表单的时候，为了阻止把错误的也发送到服务器，我们通常这样设置：

   $(function(){
    var isusername;(定一个变量)
    var ispwd;
     $('form').submit(function(e){
       if(!isusername || !ispwd){
         e.preventDefault();（阻止事件的默认事件）
      })
   });

1、在nodejs中我们可以用以下方法来（加载）跳转页面： JQuery 中的load() 这是实行加载一个页面 window.location() 这是在windows下跳转到一个指定的页面二、 node.js中MongoDB的安装步骤及相关操作： 1.下载安装程序。（windowXP只能使用2.2以前的版本，window7以上系统可以使用最新版本）下载地址：[url=http://www.mongodb.org/downloads]http://www.mongodb.org/downloads[/url] 2.开始安装MongoDB。如果是XP系统可以直接将安装目录拷贝到指定的目录下。如果win7系统则运行安装程序，可以自己选择安装路径。（注意安装路径不要出现中文）安装好的MONgoDB默认在C:\Program Files\MongoDB\Server\3.2\bin 3.在安装的同一目录下创建一个目录data，然后在data目录中创建db目录和log目录。 4.在命令行里输入 cd C:\Program Files\MongoDB\Server\3.2\bin回车，再输入mongo。进行mongo.exe操作界面。 5.开始运行MongoDB。可以通过以下命令将MongoDB的程序安装到windows的服务中。最后打开命令行，切换到MongoDB的bin目录下。运行： mongod.exe --dbpath "c:\data\db" --logpath "c:\data\log\mongodb.log" --install 6.在mongo.exe中我们可以完成增、删、改、查:下面依次介绍在这之前我们可以用show dbs来查看当前mongo中的所有数据库，如果没有就用use f30(先找有没有F30，如果没有就自动创建一个名为f30的数据库) 1>增加：db.users.insert({maen:'dd',age:20}) 增加后，可能用db.users.find()来看是否增加成功 2>删除：db.users.remove({maen:'dd'}) 或 db.users.remove({}) （这是删除users里面的所有数据） 3>修改：db.users.update({maen:'dd'},{age:22}) 把名字dd的年龄修改为22 4>查找：db.users.find({age:{$gt:20}) 查找大于20的数据三、我们可以通过BUTTON来提交数据，并跳转到登录界面，代码如下：

 $("input[type=button]").click(function(e){
 if(!isUsernameValid || !isPwdValid){ //用if语句来判断当用户名或者密码有一个为false时就弹出一个消息框，并提示：请输入正确的信息。
           alert('请输入正确的信息');
           return;  //结束
         }
         $.ajax({       //用ajax来实现不刷新网页的基础上更新数据
           type:"post", //请求方式
           url:"/users/reg", //路径
           data:{
             username:$("input[name=username]").val(),  //获取input中name为username的值
             pwd:$("input[name=pwd]").val() //获取input中name为pwd的值
           },
           success:function(){
             alert("注册成功");
             window.location = "login.html"; //注册成功就跳转到login.html
           }
         });
         
       })

以上代码就是用ajax的方式来实现注册功能。

全部评论(0)

上一篇：vue-resource 拦截器使用详解
下一篇：vue不通过路由直接获取url中参数的方法示例

资讯排行榜
更多>>