我正在处理有关对象内部Ajax回调的问题。请考虑以下代码:
Search.prototype = { ask : function( query ) { // Display loader $('.loader').show(); $.ajax({ dataType : 'jsonp', type : 'GET', url : 'http://api.deezer.com/search/track/', data : { output : 'jsonp', q : query } }).done(function(res) { this.loadResults( res ); // [Error] Object success has no method 'loadResult' }); }, loadResults : function (res) { // Hide loader $('.loader').hide(); console.log( res ); // doing some stuff // ... } } var search = new Search(); search.ask( 'eminem' );
我收到一个错误Object success has no method loadResult,这很有意义,因为回调是匿名jQuery函数的一部分。
Object success has no method loadResult
但是如何获取我的初始对象实例?
我一直在尝试一个var = this; 在Ajax调用之前,但出于相同的原因我将无法使用。
我不知道是否可能这样做,或者问题是否出在我的代码全球组织。随时向我建议最佳做法:)
预先感谢。
我混淆了代码中的某些内容,尽管没有必要在此处发布,但最终我在代码中更早地发现了问题。对于那个很抱歉。
这是我的完整代码,现在可以使用:
define(['jquery'], function($) { var Search = function() { this._keyDownTimer = 0; this._searchDelay = 1000; // ms }; Search.prototype = { // The init function that I though it was unnecessary to post here. Sorry :/ init : function() { $('#q').on('keydown', (function(evt) { clearTimeout( this._keyDownTimer ); this._keyDownTimer = setTimeout( (function() { this.ask( $('#q').val() ); }).bind( this ), this._searchDelay); /* <-- Here's the solution. I forgot to bind `this` to the timeout callback function, so the `this` under all of my code was referring to the anonymous function of this callback. */ }).bind( this )); }, ask : function( query ) { // Display loader $('.loader').show(); console.log(this); // Now `this` refers to my object :) var req = $.ajax({ dataType : 'jsonp', type : 'GET', url : 'http://api.deezer.com/search/track/', context : this, data : { output : 'jsonp', q : query } }); req.done(function(res) { this.loadResults(res); }); }, loadResults : function (res) { // Hide loader $('.loader').hide(); // doing some stuff // ... } }; return new Search; });
感谢您的答复,它确实有所帮助。
铅解决了。
有几种方法可以做到这一点。
您可以设置contextajax选项的设置:
context
jQuery.ajax
$.ajax({ context: this
Function.prototype.bind
US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind)
.done(function (res) { }.bind(this));
但是,它没有像…那样得到广泛的支持。
jQuery.proxy
为此创建的。
.done($.proxy(function (res) { }, this);
var self = this; $.ajax({ /* snip */ .done(function (res) { self.loadResults(res);
这通常是在JavaScript中完成的,以便this在较低范围内进行访问。
this
$.ajax({ /* snip */ .then(res => this.loadResults(res));