2013-07-31 38 views
0

以下Ajax的工作原理阿賈克斯設置「語境」不會影響「數據的位置

function Retrieve(el) { 
    var table = this; 
    this.el = el; 
    this.fetchInfo = function() { 
     $.ajax('data.html', { 
      context: table, 
      <!-- QUESTION HERE --> 
      data: { 
       location: table.data('location') 
      }, 
      success: function (response) { 
       this.el.find('.info').html(response).fadeIn(); 
      }, 
     } 
     } 

但我很奇怪,爲什麼我不能在指明符合this.data替換table.data。由於我將上下文設置爲table變量,現在應將this設置爲table所指的正確值?這適用於Ajax對象的其他成員(包括success),但不適用於data的成員。爲什麼會這樣?

data('name')提取物標記值與屬性data-name

回答

0

綜觀$.ajax()documentation,我發現context被設置爲callbackContext變量。這與使用success,error,beforeSend,complete,但不與data選項。

AJAX選項被分配到一個名爲s變量:

s = jQuery.ajaxSetup({}, options), 

數據選項被轉換成字符串,但不使用callBackContext

// Convert data if not already a string 
if (s.data && s.processData && typeof s.data !== "string") { 
    s.data = jQuery.param(s.data, s.traditional); 
} 

因此,有必要設置指定使用可變以外thisdata的元素。

+0

您似乎完全改變了這個問題,因爲我回答它... – Alnitak

+0

我只是回到了原來的問題,這是我之前你問我的代碼更多。 – Forethinker

+0

這是沒有什麼幫助,因爲它完全破壞了我給出的答案的上下文(沒有雙關語意)。我想知道如何在'data:'塊中使用'this',我給你的答案告訴你如何 - 通過修正調用'fetchInfo'時的'this'。 – Alnitak

1

你給的context變量只適用於在success回調中,並不會改變任何傳遞給$.ajax其他參數的任何東西。

因此,答案取決於您如何實際上致電fetchInfodata:變量將在fetchInfo具有的任何上下文中解決。鑑於您遇到問題,這表明您是而不是以您的Retrieve對象爲上下文調用該函數。

編輯這條線是你的問題:

this.el.on('click', 'button', this.fetchInfo); 

只是因爲你已經提到this.fetchInfo,不會使this上下文時,它的後續調用。試試這個:

this.el.on('click', 'button', $.proxy(this.fetchInfo, this)); 
+0

只是爲了澄清,是否在'函數'裏面加入'context'變量來替換'this'的上下文?我沒有遇到任何問題,但我只是想知道爲什麼。我如何改變我的代碼,使得'this.data'可以代替'table.data'? – Forethinker

+0

你說你「_不能用'this.data'_」替換'table.data',這表明你已經嘗試失敗了。只要'fetchInfo'被調用爲'this.fetchInfo()'或'table.fetchInfo()',就可以替換它,從而確保'fetchInfo'內的'this'具有與_outside_相同的值。 – Alnitak

+0

好吧,我同意你所說的一切,但我仍然沒有發現爲什麼上下文對於回調和非回調成員來說是不同的。你能告訴我爲什麼有差別? – Forethinker