0

我有以下代码:

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

div里面的HTML来自外部源,不知道它的结构,无法控制。

单击此链接后,我需要发布一些数据。所以我在 div 元素上添加了一个 onclick 事件处理程序,希望事件能够传播,并使用 jQuery ajax 函数发布数据。

这在除 Safari 之外的所有浏览器中都运行良好 - 它不返回任何错误,调用回调函数但由于某种原因没有到达服务器。每次收到请求时,我都会写入数据库。尝试在浏览器中手动加载帖子网址 - 工作正常并在数据库中创建记录。还尝试了 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

You want to look at jQuery's .delegate() method. It tells an element to listen for certain event bubbling up from a certain element and to execute behavior when it is observed. You also want to prevent the default action of the link, and send the browser to the link when the ajax operation is complete.

Docs: http://api.jquery.com/delegate/

Sample code:

$( '#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'
    );
} );

This:

  1. delegates the event
  2. prevents default
  3. awaits ajax response
  4. sends browser to link

Demo: http://jaaulde.com/test_bed/dasha_salo/

于 2011-04-02T18:01:38.623 回答