0

これは以前に尋ねられたことがあり、私は周りを見回し、多くの方法を試しましたが、実行されません. alert関数だけが動作するようです。ajaxsuccess:で実行した後、小さなdivをロードしようとしています。POSTこれが私のコードです:

$("#send").click(function(e) { e.preventDefault();

          $.ajax({
            type: 'POST',
            url: 'actions/update.php',
            data: $('#content').serialize(),
            success: function() {
          $(this).html('<div id="status">Saved!</div>');
          }
          });

        });

      $('#status').delay(5000).fadeOut(400);

この Div への私の CSS:

#status {
position:fixed;
top:50%;
left:50%;
z-index:100000;
width:150px;
height:150px;
margin:-75px 0 0 -75px;
background-color:rgba(0,0,0,0.7);
border-radius:150px;
font-size:30px;
line-height:150px;
font-weight:700;
color:#fff;
text-align:center;
cursor:default; }

どこかで競合を引き起こしている可能性はありますか? これは、e.preventDefault();ヘルプやリンクをいただければ幸いです。

4

3 に答える 3

3
$("#send").click(function(e) { e.preventDefault();
          var that = $(this);
          $.ajax({
            type: 'POST',
            url: 'actions/update.php',
            data: $('#content').serialize(),
            success: function() {
          that.html('<div id="status">Saved!</div>');

          $('#status').delay(5000).fadeOut(400);
          }
          });

        });

ここでの問題はthis、コールバック内にあると思われるものではないということです。上記を試してください

編集:あなたのコメントに応えて:

テキストは new で上書きされますdiv。これを回避する 1 つの方法は、新しい div を元の要素の子要素に挿入することです。フェード効果を得るには、それをコールバックにも入れる必要があります。それ以外の場合は、ajax 呼び出しが戻る前に実行されます。これは、ajax 呼び出しが非同期であり、サーバーがデータを返すのを待っている間、残りの JavaScript コードが引き続き実行されるためです。

Edit2:クリックしている要素のタイプはわかりませんが、ここには2つのアプローチがあります:

1) クリックした要素に子要素を追加します。例:<a #id="send"><div id=someElement></div></a>

2)クリックした要素の隣に要素を追加し、新しいdivでそれをターゲットにします

于 2013-10-03T00:22:56.160 に答える
2

$.ajax コールバック内では、context( this) はデフォルトで $.ajax によって返される jqXHR オブジェクトです。
ただし、 $.ajax メソッドの構成オブジェクトで context プロパティを使用して、必要に応じて設定することができます。例えば

  $.ajax({
    type: 'POST',
    url: 'actions/update.php',
    data: $('#content').serialize(),
    context: this, //<----
    success: function() {
      $(this).html('<div id="status">Saved!</div>');
    }
  });

これにより、すべてのコールバックのコンテキストが呼び出し元の関数のコンテキストに設定されます。

于 2013-10-03T00:24:12.163 に答える
0
$("#send").click(function(e) { 
    e.preventDefault();
    $.ajax({
        type: 'POST',
        url: 'actions/update.php',
        data: $('#content').serialize(),
    }).done(function() {
        $('#status').html('Saved!');
    });
$('#status').delay(5000).fadeOut(400);
<div id='status'></div>
于 2013-10-03T00:24:17.397 に答える