0

私は次のコードを持っています：

<div id="parentDiv">
    <a href="someurl"> ... </a>
</div>

div内のHTMLは外部ソースからのものであり、その構造がわからないため、制御できません。

このリンクがクリックされたら、いくつかのデータを投稿する必要があります。そこで、div要素にonclickイベントハンドラーを追加し、イベントが伝播することを期待して、jQueryajax関数を使用してデータを投稿しました。

これはSafariを除くすべてのブラウザで正常に機能しました。エラーは返されず、コールバック関数が呼び出されますが、何らかの理由でサーバーに到達しません。リクエストを受け取るたびにデータベースに書き込みます。ブラウザに投稿URLを手動でロードしようとしました-正常に動作し、dbにレコードが作成されます。FFとChromeも試してみました-期待どおりに動作します。

アラートをコールバック関数に入れると呼び出されますが、Safariではdata=nullです。

$('#parentDiv').delegate( 'a', 'click', function()
{
    $.post('posturl', 
        { param1: 'test'}, 
        function(data)
        { 
            alert('data = '+data);
        },
        "json"
    );
});

この状況でAJAXが機能することを期待するのは正しいですか？そして、この問題に対するより良い解決策はありますか？

ありがとうございました！

4

2 に答える 2

2

delegateこれは、非同期AJAXと組み合わせる必要があるようです。これは決して良いことではないことに注意してください。唯一の本当の例外は、ページを離れる直前にAJAXリクエストを実行したい場合です。

コードは次のようになります。

$('#parentDiv').delegate( 'a', 'click', function()
    $.ajax({
      type: 'POST',
      url: 'posturl',
      { param1: 'test'}, 
      dataType: 'json',
      async: false
    });
});

これは、POSTリクエストが終了するのを待ってから、リンクをたどり続けます。location = urlこのソリューションでは、ミドルクリックなどの通常のブラウザアクションを通常どおり実行できるため、これは成功コールバックで使用するよりも優れていることに注意してください。

于 2011-04-02T18:48:24.400 に答える
1

.delegate()jQueryのメソッドを見たいと思います。これは、特定の要素からバブリングする特定のイベントをリッスンし、それが観察されたときに動作を実行するように要素に指示します。また、リンクのデフォルトのアクションを防ぎ、ajax操作が完了したときにブラウザーをリンクに送信する必要があります。

ドキュメント： http ：//api.jquery.com/delegate/

サンプルコード：

$( '#parentDiv' ).delegate( 'a', 'click', function( e )
{
    var url = this.href;

    e.preventDefault();

    $.post(
        'posturl', 
        {
            param1: 'test'
        },
        function(data)
        {
            alert('data = ' + data);
            window.location = url;
        },
        'json'
    );
} );

これ：

  1. イベントを委任します
  2. デフォルトを防ぎます
  3. ajaxの応答を待つ
  4. リンクにブラウザを送信します

デモ： http： //jaaulde.com/test_bed/dasha_salo/

于 2011-04-02T18:01:38.623 に答える