$（これは）ファイルから関数内で

Question

次のコードをロードするHTMLコンテンツを動作しません（私はthis threadを使用）

<script> 
$.fn.loadWithoutCache = function(){ 
$.ajax({ 
    url: arguments[0], 
    cache: false, 
    dataType: "html", 
    success: function(data) { 
     $(this).html(data);  // This is not working 
     //$('#result').html(data); //THIS WORKS!!! 
     alert(data);   // This alerts the contents of page.html 
    } 
}); 
} 


$('#result').loadWithoutCache('page.html'); 

</script> 

は、私は問題が何であるかを教えてください？ 私はそれが愚かな何か:)

編集願っています：正しいコード

<script> 
$(document).ready(function() { 

$.fn.loadWithoutCache = function(){ 
var $el = $(this); 
$.ajax({ 
    url: arguments[0], 
    cache: false, 
    dataType: "html", 
    context: this, 
    success: function(data) { 
    $el.html(data); 
    } 
}); 
} 

$('#result').loadWithoutCache('page.html'); 

}); 
</scipt> 

おかげでジョン、みんな！

Answer 1

コールバック（success）関数が実行され、それはすでに終了しているとして、それは、loadWithoutCache方法の範囲では実行されません。 jQueryのAJAX呼び出し、 `this`はjQueryのXHRオブジェクトを参照する内部

$.fn.loadWithoutCache = function(){ 
    $.ajax({ 
    url: arguments[0], 
    cache: false, 
    dataType: "html", 
    context: this, 
    success: function(data) { 
     $(this).html(data); 
    } 
    }); 
} 

Answer 2

問題は、成功コールバック内で、thisに期待する値がないことです。

ただし、の内部にthis（期待値）のアクセス権があります。したがって、$(this)をローカル変数に保存し、成功ハンドラ内からその変数にアクセスすることで目標を達成できます（クロージャを作成する）。

これは、あなたが何をする必要があるかです：

$.fn.loadWithoutCache = function(){ 
var $el = $(this); 
$.ajax({ 
    url: arguments[0], 
    cache: false, 
    dataType: "html", 
    success: function(data) { 
     $el.html(data); 
     alert(data); 
    } 
}); 
} 

Answer 3

jQueryのこれは文脈です。 http://remysharp.com/2007/04/12/jquerys-this-demystified/

console.log($(this))さまざまな点で、それが何を参照しているかを確認してください。

Answer 4

thisのスコープが間違っています。あなたはthisは異なるオブジェクトにバインドされ、AJAX成功関数の外で変数にごthisを保存し、AJAXコールバック内でその変数

<script> 
$.fn.loadWithoutCache = function(){ 
var self = this; 
$.ajax({ 
    url: arguments[0], 
    cache: false, 
    dataType: "html", 
    success: function(data) { 
     self.html(data);  // This is not working 
     //$('#result').html(data); //THIS WORKS!!! 
     alert(data);   // This alerts the contents of page.html 
    } 
}); 
} 


$('#result').loadWithoutCache('page.html'); 

Answer 5

からそれを参照する必要があります。プラグインのターゲットを再利用する場合は、プラグインをローカル変数に格納（キャプチャ）して使用します。応答が到着したときに

$.fn.loadWithoutCache = function(){ 
var $target = $(this); 
$.ajax({ 
    url: arguments[0], 
    cache: false, 
    dataType: "html", 
    success: function(data) { 
     $target.html(data); // note change 
    } 
}); 
}