用jQuery加载动态更改滑块内容

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

<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

这是发生了什么之后，我称之为加载功能与follower_status.php更换滑块类： enter image description here

来源

2013-04-22 harsh8888

的AJAX请求实现getMethod工作没问题，并达到了目的。

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

来源

2013-04-25 03:21:07 harsh8888

用jQuery加载动态更改滑块内容

回答

相关问题