jquery - 如何从通过 jQuery .load() 加载的内容中获取数据属性值

Question

我正在使用 jQuery .load() 加载内容，在添加的内容中是一些数据属性，我想从中获取值以传递给另一个函数。

.load() 代码是:

url += ' #post';    

$("#modal_base #modal_inner").load(url , function(response, status, xhr) {
    if (status == "error") {
        var msg = "Sorry but there was an error: ";
        $('#error').appendTo( '#modal_inner' );
        $("#error").html(msg + xhr.status + " " + xhr.statusText);
    }
});

内容加载后，数据属性位于#modal_base #modal_inner #post中。我认为该元素没有事件，我需要以某种方式将委托(delegate)事件处理程序附加到文档元素。

获取 data-pag-next 和 data-pag-next 值的最佳方法是什么？

Answer 1

一旦检索到的页面的元素已加载到目标元素中并更新 DOM，complete 回调就会触发，因此您只需查找它即可:

$("#modal_base #modal_inner").load(url , function(response, status, xhr) {
    if (status == "error") {
        var msg = "Sorry but there was an error: ";
        $('#error').appendTo( '#modal_inner' );
        $("#error").html(msg + xhr.status + " " + xhr.statusText);
    } else {
        alert( $(this).find('#post').attr('data-pag-next');
        alert( $(this).find('#post').data('pag-next') ); //If using jQuery 1.4.3+
        //examples of getting the data out
        window.yourvar = $(this).find('#post').data('pag-next'); //you can access window.yourvar anywhere in your code outside .load()
        some_function_of_your( $(this).find('#post').data('pag-next') );//pass the value to some function defined by you in the global scope
    }
});