在前端開發中，使用Ajax進行異步請求是非常常見的操作。通常情況下，我們會通過Ajax向后臺提交一些數據，然后在前端頁面上顯示相應的結果。然而有時候，在Ajax提交成功之后，卻無法正確地在頁面上展示我們期望的結果，出現了“提交成功但顯示失敗”的情況。

這種情況通常出現在以下幾種情況下：

1. 后臺返回的數據格式不正確。在Ajax提交成功之后，后臺會返回一個JSON對象或者其他格式的數據。如果后臺返回的數據格式不正確，前端頁面就無法正確地解析數據，從而導致“提交成功但顯示失敗”的情況。例如，我們期望后臺返回一個包含用戶信息的JSON對象，但實際上返回的是一個字符串或者其他非JSON格式的數據。

$.ajax({
url: 'example.com/api',
method: 'POST',
data: {
username: 'john',
password: 'password'
},
success: function(data) {
// 解析后臺返回的數據
var userInfo = JSON.parse(data);
// 顯示用戶信息
$('#username').text(userInfo.username);
$('#email').text(userInfo.email);
},
error: function() {
// 處理錯誤情況
$('#result').text('提交成功但顯示失敗');
}
});

2. 前端頁面邏輯錯誤。有時候，即使Ajax提交成功之后，前端頁面的邏輯也可能導致無法正確顯示結果。例如，在上面的代碼中，如果我們在頁面上沒有正確的DOM元素來顯示用戶信息，那么就無法正確地在頁面上展示結果。

3. 服務器返回了錯誤的狀態碼。盡管Ajax提交成功了，但是服務器返回了錯誤的狀態碼，如404表示資源未找到，或500表示服務器內部錯誤等。這種情況下，前端頁面也會顯示“提交成功但顯示失敗”的結果。

$.ajax({
url: 'example.com/api',
method: 'POST',
data: {
username: 'john',
password: 'password'
},
success: function(data) {
// 處理成功情況
$('#result').text('提交成功');
},
error: function(xhr, status, error) {
// 處理錯誤情況，并顯示錯誤信息
$('#result').text('提交成功但顯示失敗: ' + error);
}
});

總之，在使用Ajax進行異步提交的過程中，出現“提交成功但顯示失敗”的情況是很常見的。我們需要仔細檢查后臺返回的數據格式、前端頁面邏輯以及服務器返回的狀態碼等相關因素，以確保能夠正確地在頁面上顯示我們期望的結果。