0

我已經實例化了JavaScript 對象「用戶」。它包含用戶管理所需的全部內容。即使加載和可能的AJAX錯誤在這裏管理。 下面是這個對象的快照。JavaScript - 基於原型的編程 - this.myFunction不是函數錯誤

var User = function(uid, ajaxURL) { 
     this.uid = uid; 
     this.ajaxURL = ajaxURL; 
    }; 
    User.prototype = { 
     loadingShow: function (tag) { 
      this.tag = (tag) ? tag : '.tab-pane'; 
      $(this.tag + ' .loading').html('<img src="img/template/loading.gif" alt="Loading..." title="Loading...">').fadeIn('fast'); 
      }, 
      //... 
    }; 
    User.prototype.loadAction = function (rel) { 
     var utls = new User(); 
      var relAttr = rel; 
     $.ajax({ 
      type: 'POST', 
      url: this.ajaxURL + '&id=' + parseInt(this.uid), 
      cache: true, 
      dataType: 'json', 
      data: { 
       toDo: relAttr 
      }, 
      beforeSend:function(){ 
       utls.loadingShow('#' + relAttr + '-tab'); 
      }, 
      //... 

它工作正常,但我只是一個問題,也許愚蠢,但我面臨的第一次JavaScript OOP和基於原型的編程。

爲什麼我必須創建var utls = new User();調用這個utls.loadingShow(而不是簡單地通過this.loadingShow(來調用它? 使用this屬性我獲得了錯誤「TypeError:this.loadingShow不是函數」

+0

您可以發佈'loadAction'方法的其餘部分,特別是調用'$ .ajax'之後的部分嗎? – Tibos

+0

我編輯帖子,因爲你需要:) Thx –

+0

你不必創建一個新的,你只需要瞭解範圍。在ajax函數裏,thisArg不再指向User對象,而是指向窗口或jQuery ajax或其他東西。您可以使用Function.bind或將thisArg存儲在ajax函數作用域之外。或者我猜根據庫克怪獸的回答,有一個你可以使用的上下文屬性:P – rlemon

回答

4

"Why must i create var utls = new User(); for call this utls.loadingShow(and not simply call it by this.loadingShow(?"

因爲在回調this被設置爲jqXHR對象。

要覆蓋它,可以將$.ajax請求的context:屬性設置爲所需的this值。

$.ajax({ 
     type: 'POST', 
     url: this.ajaxURL + '&id=' + parseInt(this.uid), 
     cache: true, 
     dataType: 'json', 
     context: this, // <-- set the `this` value of the callbacks 
     data: { 
      toDo: relAttr 
     }, 
     beforeSend:function(){ 
     // v--- now it's correct 
      this.loadingShow('#' + relAttr + '-tab'); 
     }, 
     success: function(data) { 
      var art_tmp_str = ''; 

// Why are you using this? ---v 
//   $(document).ajaxComplete(function(event, request, settings) { 

      // v--- now it's correct 
       this.loadingHide('#' + relAttr + '-tab'); 
       $('#' + relAttr + '-tab').html(''); 
       if(data.success === true) { 
           // v--- now it's correct 
        art_tmp_str = this.writeAction(relAttr, data); 
        $('#' + relAttr + '-tab').append(art_tmp_str); 
       } else 
        $('#' + relAttr + '-tab').append('<p>' + data.error + '</p>'); 
//   }); 

此外,不應該有任何需要給一個處理程序,.ajaxComplete()當你在一個success回調是已。如果您確實希望將單個行爲應用於所有已完成的請求,則應在完成任何ajax請求之前完成此操作。

+0

我不能要求更好的東西! 非常感謝! :) –

+0

不客氣。 –