设为首页 收藏本站
查看: 1954|回复: 0

[经验分享] 利用ajax的方式来提交数据到后台数据库及交互功能

[复制链接]

尚未签到

发表于 2017-2-25 10:42:30 | 显示全部楼层 |阅读模式
  怎么样用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以上系统可以使用最新版本)下载地址:http://www.mongodb.org/downloads

      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的方式来实现注册功能。个人名言:每天进步一点点,相信成功是属于有准备的人!!!

运维网声明 1、欢迎大家加入本站运维交流群:群②:261659950 群⑤:202807635 群⑦870801961 群⑧679858003
2、本站所有主题由该帖子作者发表,该帖子作者与运维网享有帖子相关版权
3、所有作品的著作权均归原作者享有,请您和我们一样尊重他人的著作权等合法权益。如果您对作品感到满意,请购买正版
4、禁止制作、复制、发布和传播具有反动、淫秽、色情、暴力、凶杀等内容的信息,一经发现立即删除。若您因此触犯法律,一切后果自负,我们对此不承担任何责任
5、所有资源均系网友上传或者通过网络收集,我们仅提供一个展示、介绍、观摩学习的平台,我们不对其内容的准确性、可靠性、正当性、安全性、合法性等负责,亦不承担任何法律责任
6、所有作品仅供您个人学习、研究或欣赏,不得用于商业或者其他用途,否则,一切后果均由您自己承担,我们对此不承担任何法律责任
7、如涉及侵犯版权等问题,请您及时通知我们,我们将立即采取措施予以解决
8、联系人Email:admin@iyunv.com 网址:www.yunweiku.com

所有资源均系网友上传或者通过网络收集,我们仅提供一个展示、介绍、观摩学习的平台,我们不对其承担任何法律责任,如涉及侵犯版权等问题,请您及时通知我们,我们将立即处理,联系人Email:kefu@iyunv.com,QQ:1061981298 本贴地址:https://www.yunweiku.com/thread-346957-1-1.html 上篇帖子: requirejs + vue 项目搭建 下篇帖子: Nwjs从入门到精通 菜鸟实践笔记【1】
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

扫码加入运维网微信交流群X

扫码加入运维网微信交流群

扫描二维码加入运维网微信交流群,最新一手资源尽在官方微信交流群!快快加入我们吧...

扫描微信二维码查看详情

客服E-mail:kefu@iyunv.com 客服QQ:1061981298


QQ群⑦:运维网交流群⑦ QQ群⑧:运维网交流群⑧ k8s群:运维网kubernetes交流群


提醒:禁止发布任何违反国家法律、法规的言论与图片等内容;本站内容均来自个人观点与网络等信息,非本站认同之观点.


本站大部分资源是网友从网上搜集分享而来,其版权均归原作者及其网站所有,我们尊重他人的合法权益,如有内容侵犯您的合法权益,请及时与我们联系进行核实删除!



合作伙伴: 青云cloud

快速回复 返回顶部 返回列表