XUI Ajax示例

Question

我不明白如何使用XUI xhr（ajax）調用。請看下面的代碼：

x$('#left-panel').xhr('/panel', { 
    async: true, 
    callback: function() { 
     alert("The response is " + this.responseText); 
    }, 
    headers:{ 
     'Mobile':'true' 
    } 
}); 

那麼，這是否意味着，當在左面板用戶將鼠標懸停，XUI將使一個AJAX調用的URL /panel，並就成功的警報語句？但是如果我將ajax調用改爲執行ONBLUR呢？

Answer 1

的xui.js api docs狀態的XHR請求......

...總是調用上的元素集合，並使用HTML的行爲。

因此，在您的/panel的GET請求中，響應文本會出現在警報窗口中，因爲這就是您的回調所要做的。然而，如果沒有回調，這將加載的響應到#left-panel元素，就好像你使用：

x$('#left-panel').xhr('/panel', { 
    async: true, 
    callback: function() { 
     x$('#left-panel').html(this.responseText); 
    }, 
    headers:{ 
     'Mobile':'true' 
    } 
}); 

也就是說，上面的代碼應該產生同樣的效果：

x$('#left-panel').xhr('/panel', { 
    async: true, 
    headers:{ 
     'Mobile':'true' 
    } 
}); 

另外，調用xhr請求與目標元素事件無關。也就是說，它不一定是由懸停（或模糊）觸發的。假設您想綁定到單擊#left-panel元素。然後您需要如下東西：

x$('#left-panel').on('click', function(e){ 
    this.xhr('/panel', { 
     async: true, 
     callback: function() { 
      alert("The response is " + this.responseText); 
     }, 
     headers:{ 
      'Mobile':'true' 
     } 
    }); 
});