javascript - JQuery $（this）はajax POSTの後でアクセスできませんか？

Question

クリックイベントを共有するリンクがたくさんあるとしましょう。

<a href="#" class="do-stuff">Click me</a>
<a href="#" class="do-stuff">Click me</a>
<a href="#" class="do-stuff">Click me</a>
<a href="#" class="do-stuff">Click me</a>

$（'。do-stuff'）。click関数で、データベースをstuffで更新するJQuery ajax POSTリクエストを実行すると、正常な応答が得られます。ajaxが完了したら、リンクテキストの値をサーバーから返送するものに変更したいだけです...

$('.do-stuff').click(function () {
$.ajax({
  type: "POST",
  url: "MyWebService.asmx/DoSomething",
  data: '{CurrentLinkText: "'+ $(this).text() +'"}',
  contentType: "application/json; charset=utf-8",
  dataType: "json",
  success: function (result) {
    $(this).text(result.d);
  },
  error: function (XMLHttpRequest, textStatus, errorThrown) {
    alert(textStatus);
  }
});

}）;

これは問題なく呼び出され、「result.d」が実際にサーバーからのテキストであることを確認しましたが、テキストは変更されていません。$（this）要素はAJAX投稿後にアクセスできなくなったと思いますか？これを回避するにはどうすればよいですか？

Answer 1

一般に、そのようなコンテキストが失われた場合は、オブジェクトへの参照を保存できます。このような：

function clickHandler() {
    var that = this;
    $.ajax( { url: '#',
        success: function (result) {
            $(that).text(result.d);
        }
    );
}

Answer 2

ここを参照してください： AJAX成功の内部の$（this）が機能しない

コンテキストオプションを設定できます：

このオブジェクトは、すべてのAjax関連のコールバックのコンテキストになります。デフォルトでは、コンテキストは呼び出しで使用されるajax設定を表すオブジェクトです（$.ajaxSettingsは$.ajaxに渡される設定とマージされます）。（...）

例：

$.ajax({
    //...
    context: this,
    success: function(json) {
        //...
    }
});

または$.proxyを使用します：

$.ajax({
    //...
    success: $.proxy(function(json) {
         //...
    }, this)
});

Answer 3

試す：

success: $.proxy(function(result) {
         //...
    }, this)

Answer 4

ここでの回答からわかるように、これを行う方法はたくさんあります。個人的には、現在の値にバインドされた関数を作成することを好みますthis。

success: (function(target) {
              return function(result) {
                   $(target).text(result.d);
              }
         })(this)

それはきちんとしていて、きれいで$(this)、外側の文脈と同じままです。つまり、イベントを発生させた要素になります。

Answer 5

jQuery('#youridvalue').html(result.d);
jQuery('.yourclassvalue').html(result.d);

これを使って