0

我使用 $.ajax({}) 和外部 php 脚本创建了一个用于更新和处理数据的 Javascript 对象。调用对象时从对象返回的表元素包含许多隐藏的 tr(使用“hidden”类,该类设置为 display:none)。

这是对象内部的显示功能:

this.displayData = function(location_div) {
    var location_div = location_div;
    $.ajax({
            url:"display_data.php",
            type: "POST", 
            success:function(response){ 
                $(location_div).html(response);
                },
            error:function(response){alert("Error Displaying Problems." + response)},
        });
    };

显示:

<div id="location_div">
    <table>
        <tbody>
            <tr class="hidden"></tr>
            <tr class="hidden"></tr>
            <tr class="hidden"></tr>
            <tr class="hidden"></tr>
        </tbody>
    <table>
</div>

(注意:“#location_div”是传递给“displayData(location_div)”的元素)

我遇到的问题是当 JQuery 尝试访问返回的数据时。我有一个查找所有 tr 的函数,将每个推送到一个数组,然后逐个淡化每个。

var elements_array = new Array();
$("#location_div table tbody").children().each(function() {
    elements_array.push(this);
});
//function for fading in each element in the array
fadeAllIn(elements_array);

据我了解,加载 Ajax 的元素不是 DOM 的一部分,因此需要使用 JQuery 函数,例如 $(element).on(); 或 $(element).live(); 但是,我尝试过的任何方法都没有奏效。该表正在加载,但 JQuery 似乎无法使用 .each() 选择每个 tr,因为该表是 Ajax 加载的。

有谁知道这个的解决方案/解决方法?有没有比使用 JQuery 淡入表格中的每个 tr 更好的解决方案?

4

2 回答 2

2

在我看来,您需要通过 .on 方法使用委托。要使用 javascript/jquery 淡化元素,您需要做的是在页面加载时将事件处理程序附加到页面上的元素。

例如:

$("location_div").on("click", "table tbody", function() { [function] });

或类似的东西,其中“点击”是您的事件。

于 2013-06-21T22:08:01.270 回答
2

我认为您只需要在加载动态数据后绑定您的事件/动画。

this.displayData = function(location_div) {
var location_div = location_div;
$.ajax({
        url:"display_data.php",
        type: "POST", 
        success:function(response){ 
            $(location_div).html(response);
            bind_events();                
        },
        error:function(response){alert("Error Displaying Problems." + response)},
    });
};

var bind_events = function(){
    var elements_array = new Array();
            $("#location_div table tbody").children().each(function() {
                 elements_array.push(this);
            });
            fadeAllIn(elements_array);
};
于 2013-06-21T22:05:07.690 回答