【问题标题】:jQuery - do something after an element is loaded via ajax, but not in the ajax functionjQuery - 在通过 ajax 加载元素后做某事,但不在 ajax 函数中
【发布时间】:2010-08-11 16:59:30
【问题描述】:

我正在尝试通过 ajax 调用查看要加载到页面上的元素。我无权访问进行 ajax 调用的 jquery。因此,当一些新的 html 加载到页面上时,我想对其进行一些更改。

我目前正在尝试使用 .load() 函数:

$( '.autosuggest_keyword' ).load( 
    function()
    { 
        $( this ).val( 'load test' );
    }
);

什么都没做。我什至尝试将其设为实时绑定,但这并没有什么意义,但我想我会尝试一下。

选择器是正确的。

有什么想法吗?

【问题讨论】:

    标签: jquery ajax jquery-load


    【解决方案1】:

    .load() 函数需要一个 URL,将 AJAX 请求发送到该 URL,从服务器获取数据并更新选择器中的给定元素。所以你需要传递一个 URL:

    $('.autosuggest_keyword').load('/foo');
    

    【讨论】:

    • 那么对于我正在尝试做的事情来说,这是错误的功能。有什么合适的想法吗?
    • 这是错误的。 .load 可以接受一个 URL,但它也可以接受一个函数。见:api.jquery.com/load-event
    【解决方案2】:

    你知道什么叫初始 ajax 吗?如果是这样,您可以使用相同的事件调用函数。虽然如果您尝试更改 ajax 正在加载的内容,这可能会导致一些混乱。

    【讨论】:

    • 是的,我可以弄清楚是什么调用了初始函数。但我需要更改初始调用返回的元素。现在的选择是做一个 setTimeout,我真的不想这样做:)
    • 嗯。然后我不太确定你能做什么,但它需要一些丑陋的黑客来做。亲吻和弥补让你远离 ajax 调用的人并使用它:D
    • 是的,看起来这就是解决方案。我希望有一些很酷的功能会“哇!那个元素加载了!让我们搞砸它!”嗯嗯。
    【解决方案3】:

    打鸭可能是答案:

    should('duck-punch ajax success handler', function() {
        var origAjax = $.ajax;
    
        $.ajax = function(settings) {
            if(settings.url === 'the/request/page') {
                var origSuccess = settings.success;
                settings.success = function(responseHTML) {
                    origSuccess.call(this, responseHTML);
                    //apply some changes to html
                }
    
            }
            origAjax.call(this, settings);
        }
    });
    

    【讨论】:

    • 打鸭。大声笑,我什至不知道你是不是在开玩笑……什么是“应该”?
    • 我将QUnit.test function 别名为Qunit.should = Qunit.test;。所以我用它作为执行运行器。谷歌打鸭。当我遇到这个时,我正在滚动。 如果它不像鸭子一样嘎嘎叫,那就用拳打它。甜!
    【解决方案4】:

    当您调用 .load 时,它会将该事件处理程序绑定到在您调用它时与您的选择器匹配的元素。由于元素是在那之后添加的,所以它永远不会被绑定。 .live 函数通过绑定到匹配选择器的当前 和未来 元素来解决这个问题。我认为你想要的是这样的(未经测试):

    $( '.autosuggest_keyword' ).live('load', 
        function()
        { 
            $( this ).val( 'load test' );
        }
    );
    

    【讨论】:

    • 其实我也试过了。没啥事儿。但是,我能够进入原始的 ajax 调用,从而绕过了整个问题。
    • "这个事件可以被发送到与 URL 关联的任何元素:图像、脚本、框架、iframe 和窗口对象。[因此不是常规元素]" -- jQuery 站点跨度>
    【解决方案5】:

    我能够访问原始的 ajax 调用,所以这个问题现在没有实际意义。不过,我将把它留给其他人查找,以防其中一个答案对他们有帮助。

    【讨论】:

      猜你喜欢
      • 2019-03-13
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-06-22
      • 2015-05-28
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多