Question

我在jQuery（bxslider）中使用滑块插件。当我的页面第一次加载时，滑块类加载了带有displayHomeLine（）函数的默认列表元素。然后我用jquery load调用另一个php来替换整个滑块类（ul和li元素）的内容。它加载正常，但它没有动画，而是显示默认的无序列表。我的问题是 - 是否可以像第一页加载时的默认内容一样为滑块设置动画？我不想刷新页面，因此还有什么选择？我的代码：

<body>
<center>

<?php
        function displayHomeTimeline(){

            $home_timeline=$_SESSION['home_timeline'];

            foreach($home_timeline as $item){
                echo '<li>'.$item->text.'</li>';
            }

        }




?>
            <div id="page_content">
            <h1>Welcome <?php echo $_SESSION['screen_name']?></h1>
                <ul id="sections">
                    <li style="width:550px;"><h2>Tweets</h2>
                    <!-- Slider -->
                    <div id="wrapper_slider">

                        <ul class="bxslider">
                            <?php displayHomeTimeline();?><--Loads the default content
                        </ul>
                    </div>



                    </li>
                    <li style="width:180px;">
                        <h2>Followers</h2>

                    </li>
                </ul>
            </div>
</center>
<script type="text/javascript">
    //function to populate the slider with follower's tweets
    function populateFollowersTweets(screen_name){
            //THIS IS THE CALL TO OTHER FILE WHICH CREATES THE CLASS FOR SLIDER
        $('#wrapper_slider').load('follower_status.php?sname='+screen_name+'');
          //for tweets slider

              //TRIED PUTTING EXPLICIT CALL STILL DOESN"T ANIMATE
          $('.bxslider').bxSlider({
          auto:true});
    }





$(document).ready(function(){




  //for tweets slider
  $('.bxslider').bxSlider({
  auto:true});





  //for populating follower's tweets in the slider
  $('#followers_list>li').click(function(){
 //FUNCTION TO REPLACE THE CONTENT WITH NEW BXSLIDER CLASS
    populateFollowersTweets($(this).text());
  });


 });


</script>
</body>

为BXSlider创建相同的无序列表的文件：follower_status.php

<?php
    require("lib/twitteroauth/twitteroauth.php");
    session_start();

    //function to print user timelines
    function getUserTimeline($screen_name){
            $oauth_token = $_SESSION['oauth_token'];
            $oauth_token_secret = $_SESSION['oauth_token_secret'];
            $connection = new TwitterOAuth('xxx', 'xxx', $oauth_token, $oauth_token_secret);

            $tweets=$connection->get('statuses/user_timeline',array('screen_name' => $screen_name, 'count' => 10));
            foreach($tweets as $item){
                echo '<li>'.$item->text.'</li>';
            }

        }

    $screen_name=$_GET['sname'];

    echo '<ul class="bxslider">';
    getUserTimeline($screen_name);
    echo '</ul>';
?>

屏幕截图应该更好地表达我的怀疑。这是加载默认内容时的滑块： enter image description here

这是在我调用load函数用follower_status.php替换滑块类之后发生的事情： enter image description here

Answer 1

AJAX请求的getmethod工作正常，达到了目的。

   $.get('xxx.php?sname='+screen_name+'', function(data) {
          $('.bxslider').bxSlider({
          auto:true});

使用jquery加载动态更改滑块内容

1 个答案: