2011-05-08 9 views
1

jquery 로그인 시스템을 만들려고하지만 양식을 제출할 때 애니메이션 GIF가 나타납니다.jQuery .ajax 요청이 효과가 없습니다.

$(function(){ 
    // Quand le formulaire est envoyé 
    $('#submit').click(function() { 
     // Fade out 
     var html = '<div id="head">Connexion en cours...</div>'+ 
      '<div style="width:100%; text-align: center; margin-top:80px;"><span id="status">Prise de contact avec le serveur</span><span id="img"><br><img src="../img/loaders/bar_blue.gif"></span></div>'; 
     replaceandfade('#center',html, 10); 
       $('#user').attr("disabled", true); 
       $('#pswd').attr("disabled", true); 
       var user = $('#user').val(); 
       var pswd = $('#pswd').val(); 
       // On envoie les infos de connexion 
       $.ajax({ 
        type: "POST", 
        url: "ajax_login.php", 
        data: "user=bob&pswd=bob", 
        contentType: "application/json; charset=utf-8", 
        dataType: "json", 
        success: function(data) { 
         $("#status").html("En attente de la réponse"); 
         alert(data); 
         if(data.login == "failed"){ 
          $("#img").html(''); 
          $("#status").html("Le nom d'utilisateur ou le mot de passe saisie est invalide"); 
         } else if(data.login == "success"){ 
          $("#status").html("Connexion aprouvé, un instant..."); 
         } else { 
          $("#status").html("Une erreur est survenu."); 
         }; 
        } 
       }); 
    });// END OF #submit.click 
}) // END OF onload 

ajax_login.php 페이지를 반환 : {"login":"failed"}

하지만 지금은 아무것도하지 않습니다 여기

는 코드입니다.

replaceandfade 기능

function replaceandfade(div, content, sec) { 
    setTimeout(function() { 
     $(div).fadeOut("fast", function() { 
      $(div).html(content); 
      $(div).fadeIn("fast", function() {}); 
     }); 
    }, sec) 
} 
+0

경고가 호출되고 있습니까? 서버의 응답은 무엇입니까? – tster

답변

3

오류 결과를 처리하지 않습니다 요청 등 요청이 실패 할 경우 (예를 들어, 서버를 찾을 수 없거나 가능성이 응답은 500 서버 오류입니다) 그러면 아무 일도 일어나지 않을 것입니다.

당신은 예를 들어, error 함수를 사용하여 오류 처리기를 추가 할 수 있습니다, 당신이 요청이 종료 될 때 발생해야하는 작업을 지정합니다 complete 기능을 사용할 수 있습니다

$.ajax({ 
    // Other parameters 
    success: function(data) { 
     alert(data); 
    }, 
    error: function(jqXHR, textStatus, errorThrown) { 
     alert("Request failed"); 
    } 
}); 
또는

(또는 추가)와 함께 할 성공 또는 실패 결과.

자세한 내용은 documentation을 참조하십시오.

+0

아야! 나는'data : "user = bob & pswd = bob"이 URL에 값을 보내고 있다고 생각했다. "url :"ajax_login.php? user = "+ user +"& pswd = "+ pswd"로 문제를 해결했다. 아약스 요청. 오류 처리기 주셔서 감사합니다 :) –

관련 문제