duaner1634 2014-05-13 16:32
浏览 32
已采纳

将jquery slidetoggle应用于来自php的一段时间的结果

The following piece of code in php, uses a while statement to output variable $the_job_id. For each of the output I want to apply jquery slidetoggle. The problem is that in my code slidetoggle works only for the first output of my while. Not working for the rest. Any idea how i should modify my code in order slidetoggle to work for each of my while outputs?

This is my php code:

<?php

$result = mysql_query("select * from `user_job` where `job_id` IN ($all_saved_job_id) ");

while($run_job = mysql_fetch_array($result)){

  $the_job_id = $run_job['job_id']; 

echo"<div id='flip'> PRESS TO SLIDE </div>";

echo"  <div id='panel'>  $the_job_id </div>";

}// end while

?>

this is my script :

<script> 

$(document).ready(function(){
  $("#flip").click(function(){
     $("#panel").slideToggle("slow");
  });
});

</script>

this is my css :

<style>

#flip{
cursor:pointer;
margin-left:100px;
}

#panel{
padding:0px;
display:none;
}       

</style>
  • 写回答

1条回答 默认 最新

  • doutang7414 2014-05-13 16:33
    关注

    id must be unique, otherwise you'll always get the first element in the page with duplicated id, so you need to use class instead:

    echo"<div class='flip'> PRESS TO SLIDE </div>";
    
    echo"  <div class='panel'>  $the_job_id </div>";
    

    then you can use . to target elements by class name:

    $(document).ready(function(){
        $(".flip").click(function(){
            $(this).next().slideToggle("slow");
        });
    });
    

    Please note that you also need to change your CSS selector using . instead of # accordingly.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 arduino控制ps2手柄一直报错
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥85 maple软件,solve求反函数,出现rootof怎么办?
  • ¥15 求chat4.0解答一道线性规划题,用lingo编程运行,第一问要求写出数学模型和lingo语言编程模型,第二问第三问解答就行,我的ddl要到了谁来求了
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥15 maple软件,用solve求反函数出现rootof,怎么办?
  • ¥65 汇编语言除法溢出问题
  • ¥15 Visual Studio问题
  • ¥20 求一个html代码,有偿