2016-06-13 112 views
2

當我點擊提交按鈕時,textarea標籤的信息應該發送到郵件使用ajax.can任何人helpme.thankyou。Onclick ajax無法正常工作

$(document).on("click", "#submit-btn", function() { 
+0

你在做跨域的ajax調用嗎?你的網頁是否也是'ivr.callxl.com'的一部分? – vijayP

+0

你必須防止提交按鈕單擊默認行爲,否則您的表單是否受 –

回答

2

的問題是,因爲你已經掛在click事件提交按鈕,而不是submit事件form的。這意味着表單仍然是正常提交​​的,並且您的AJAX請求的響應將被忽略。

如上所述,鉤到submit事件form的要解決的問題,並使用preventDefault()停止標準表單提交:

$(document).on("submit", "#yourFormElement", function(e) { 
    e.preventDefault(); 
    $.ajax({ 
     url: "https://ivr.callxl.com/callXLWeb/SendingEmail", 
     type: 'POST',  
     contentType: "application/json; charset=utf-8", 
     data: { comment: $("#cmessage").val() }, 
     dataType: "json", 
     success: function (data, textStatus, jqXHR) { 
      if (data.success) { 
       alert("successfully sent"); 
      } else { 
       // handle error here... 
      } 
     }, 
     error: function(jqXHR, textStatus, errorThrown){ 
      alert(jqXHR.responseText); 
      console.log("Something really bad happened " + textStatus); 
      $("#errorResponse").html(jqXHR.responseText); 
     } 
    }); 
}); 

另外請注意,我除去async屬性(如true)是默認值,並向data屬性提供一個對象,以便爲您編碼值。

您還應該確保您所調用的域名支持跨域請求,否則您的請求將被Same Origin Policy阻止。如果是這種情況,那麼你需要在服務器端進行請求。

+0

問題可能是因爲url?我懷疑它是在不同的領域,它可能是一個CORS問題 – brk

+0

@ user2181397是的,這也可能是一個問題。添加了關於它的一個註釋到答案。 –

+1

@ A.Wolff謝謝。需要注意,沒有一個早上好:) –

1

我認爲你應該這樣做。

$("#submit-btn").on("click",function() { 
    $.ajax({ 
     url: "https://ivr.callxl.com/callXLWeb/SendingEmail", 
     type: 'POST',  
     contentType: "application/json; charset=utf-8", 
     data: { comment: $("#cmessage").val() }, 
     dataType: "json", 
     success: function (data, textStatus, jqXHR) { 
      if (data.success) { 
       alert("successfully sent"); 
      } else { 
       // handle error here... 
      } 
     }, 
     error: function(jqXHR, textStatus, errorThrown){ 
      alert(jqXHR.responseText); 
      console.log("Something really bad happened " + textStatus); 
      $("#errorResponse").html(jqXHR.responseText); 
     } 
    }); 
}); 
+0

首先你必須將按鈕類型從「提交」更改爲「按鈕」。 。當你點擊提交按鈕時,你可以檢查你的控制檯是否有錯誤,顯示類似這樣的東西。 XMLHttpRequest無法加載https://ivr.callxl.com/callXLWeb/SendingEmail。對預檢請求的響應不會通過訪問控制檢查:請求的資源上不存在「訪問控制 - 允許來源」標頭。原因'https://fiddle.jshell.net'因此不被允許訪問。 –

+0

所以它是因爲你正在一個不同的域發送請求。如果您修復了跨站點源問題,則此代碼將起作用。謝謝 –