2014-09-10 165 views
0

嘿傢伙和三角旗號,AJAX請求不能正常工作

我有,我想用AJAX提交表單。對於回調函數,基本上我想要發生的是,表單元素消失(.hide),並被一個div元素(這將準備好成功或某種性質)取代。然後我想讓該功能暫停5秒鐘,然後重定向到不同的URL。

AJAX請求成功提交(因爲我收到電子郵件到指定的地址,我應該)但回調函數執行不正確。有什麼建議麼?

$(document).ready(function() { 
     var $form = $('form'); 
     function register($form) { 
      $.ajax({ 
       type: $form.attr('method'), 
       url: $form.attr('action'), 
       data: $form.serialize(), 
       cache  : false, 
       dataType : 'json', 
       contentType: "application/json; charset=utf-8", 
       success: function(data){ 
        $("#mc-embedded-subscribe-form").hide("slow"); 
        $("#form").html('<div class="some-class">Some text that shows up upon successful AJAX request</div>') 
        setTimeout(5000); 
        $(".button").addEventListener("click", function(){ 
         window.location.href='http://www.neuyear.net/collections/time-domination-products'; 
        }) 
       } 
      }) 
     } 
    } 

**

更新#1

**

這是當我最初加載網站,我收到的唯一的錯誤代碼(我聽到的只有這些錯誤彈出在開發工具,不影響用戶?) enter image description here

但是,當我提交表單時,我得到此錯誤代碼 enter image description here

我也更新了我的JavaScript以下面的代碼,從誰貼幾個人服用的建議,但仍然沒有工作100%,雖然

$(document).ready(function() { 
    var $form = $('form'); 
    $form.submit(function(){ 
     $.ajax({ 
      type: $form.attr('method'), 
      url: $form.attr('action'), 
      data: $form.serialize(), 
      cache  : false, 
      dataType : 'json', 
      success: function(data){ 
       $("#mc-embedded-subscribe-form").hide("slow"); 
       $("#form").html('<div class="some-class">Some text that shows up upon successful AJAX request</div>') 
      } 
     }); 
     setTimeout(function(){ 
      window.location.href='http://www.neuyear.net/collections/time-domination-products'; 
     }, 5000) 
    }); 
}); 

喬伊

+2

任何errorin您的瀏覽器控制檯 – 2014-09-10 10:31:21

+0

您應該通過提琴手檢查HTTP響應代碼,或者如果您使用的是Chrome,然後開發工具。成功基於響應代碼定義。因此,對url的調用返回正確的值非常重要。 – codebased 2014-09-10 10:31:36

+0

刪除'contentType:「application/json; charset = utf-8」,':你沒有發送JSON數據。 – Quentin 2014-09-10 10:32:04

回答

2

的setTimeout使用是錯的。

參見:

$(document).ready(function() { 
     var $form = $('form'); 
     function register($form) { 
      $.ajax({ 
       type: $form.attr('method'), 
       url: $form.attr('action'), 
       data: $form.serialize(), 
       cache  : false, 
       dataType : 'json', 
       contentType: "application/json; charset=utf-8", 
       success: function(data){ 
        $("#mc-embedded-subscribe-form").hide("slow"); 
        $("#form").html('<div class="some-class">Some text that shows up upon successful AJAX request</div>') 
        setTimeout(function(){ 
         window.location.href='http://www.neuyear.net/collections/time-domination-products'; 
        }, 5000); 
       } 
      }) 
     } 
    }); 

此外,以下最好應另行申報,如果你希望用戶點擊一個鏈接,阿賈克斯成功後去。

$(".button").addEventListener("click", function(){ 
    window.location.href='http://www.neuyear.net/collections/time-domination-products'; 
}) 
+0

FYI,它應該等待5秒,而不是3. – Andy 2014-09-10 10:35:49

+0

@Andy:編輯搞砸了。 – 2014-09-10 10:36:32