ajax 방식 으로 등록 기능 실현(데 이 터 를 백 엔 드 데이터베이스 에 제출 하여 상호작용 완료)

2986 단어 ajax책.
1.우리 가 폼 을 검증 할 때 잘못된 것 도 서버 에 보 내 는 것 을 막 기 위해 우 리 는 보통 이렇게 설정 합 니 다.

   $(function(){
    var isusername;(     )
    var ispwd;
     $('form').submit(function(e){
       if(!isusername || !ispwd){
         e.preventDefault();(         )
      })
   });
1.nodejs 에서 우 리 는 다음 과 같은 방법 으로 페이지 를 이동 할 수 있 습 니 다.
JQuery 의 load()  이것 은 페이지 를 불 러 오 는 것 을 실행 합 니 다.
 window.location()  이것 은 windows 아래 에서 지정 한 페이지 로 이동 하 는 것 이다.   
2.node.js 에서 MongoDB 의 설치 절차 와 관련 작업:
1.설치 프로그램 을 다운로드 합 니 다.(windowXP 는 2.2 이전 버 전 만 사용 할 수 있 습 니 다.window 7 이상 시스템 은 최신 버 전 을 사용 할 수 있 습 니 다)다운로드 주소:http://www.mongodb.org/downloads
2.MongoDB 설치 시작.XP 시스템 이 라면 설치 디 렉 터 리 를 지정 한 디 렉 터 리 로 직접 복사 할 수 있 습 니 다.win 7 시스템 이 설치 프로그램 을 실행 하면 설치 경 로 를 스스로 선택 할 수 있 습 니 다.(설 치 된 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 에서 우 리 는 증,삭제,수정,검 사 를 완성 할 수 있다.다음은 순서대로 소개 한다.
그 전에 현재 mongo 의 모든 데이터 베 이 스 를 show dbs 로 볼 수 있 습 니 다.없 으 면 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:'d'},{age:22})   이름 d 의 나 이 를 22 로 수정 하 다
4>찾기:db.users.find({age:{$gt:20})  20 이상 의 데 이 터 를 찾 습 니 다.  
3.우 리 는 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 의 방식 으로 등록 기능 을 실현 하 는 것 입 니 다.

좋은 웹페이지 즐겨찾기