1

我有一组带有分页的数据的滑块,问题是包含滑块的 div 是通过 ajax 从 ajax 请求加载的。所以它不工作。

分页功能:

function loadData(page){
                    loading_show();
                    confID = $("#confID").val();
                    verID = $("#confID").attr("v");
                    $.ajax
                    ({
                        type: "POST",
                        url: "paging-offlineTemp.php",
                        data: {page:page, confID: confID, verID:verID},
                        success: function(msg)
                        {
                                loading_hide();
                                $("#container").html(msg);
                                resize_iframe();
                                $(".slider").each(function(){
                                    $(this).slider({ animate: true,
                                        value: parseInt($(this).attr("preRate")),
                                        min: 0,
                                        max: 5,
                                        step: 1
                                    });
                                    if($(this).attr("preRate") == -1) {
                                        $(this).slider({ disabled: true }); 
                                        td = $(this).parent("td");
                                        tr = $(td).parent("tr");
                                        box= $(tr).find(":checkbox");
                                        $(box).attr("checked",true);

                                    }   
                                });
                        }
                    });
                }

pageing-offlineTemp.php 太长但它只是通过限制选择下一组数据

控制滑块的功能:

$(".slider").each(function(){
                    $(this).slider({ animate: true,
                        value: parseInt($(this).attr("preRate")),
                        min: 0,
                        max: 5,
                        step: 1,
                        change: function( event, ui ) {
                            $(this).attr("rate", ui.value);
                            rate = $(this).attr("rate");
                            confID = $(this).attr("confID");
                            critID = $(this).attr("criteria");
                            paperID = $(this).attr("paperID");
                            label = $(this).parent("td").find("label");
                            $(label).html("New rate: "+ rate);
                            td = $(this).parent("td");
                            tr = $(td).parent("tr");
                            span = $(tr).find("span");
                            $(span).fadeIn("slow");
                            $.ajax ({
                                data:{rate:rate, confID:confID, critID:critID, paperID:paperID},
                                type: 'POST',
                                url:  'update_rate.php',
                                success: function(response) {
                                    //alert(response)
                                    $(span).delay(500).fadeOut('slow');
                                }
                            });
                        } 
                    });

滑块 div:

<div type="" paperID="'. $paper .'" preRate="'. intval($irate) .'"
                                 criteria="'.$row['rate_id'].'" confID="'.$conf_id.'" rate="" class="slider">
                    </div>

我猜是滑块功能不会触发,因为最初分页容器 div 是空的,并且没有带有类滑块的元素,那么有没有办法在滑块事件触发时保持分页?

4

2 回答 2

1

简短的回答:将您的移动$('.slider').each(到成功回调中ajax function

于 2012-09-11T06:49:32.660 回答
0

使ajax调用同步是一种解决方案,或者在成功回调函数中调用滑块函数也可以

于 2012-09-11T06:26:48.110 回答