0

我再次需要有关此 JQuery 代码的帮助，我真的对 JQuery 有一点经验，如果问题一团糟，我很抱歉。因为我从他们那里复制了这个，所以我把它归功于http://www.w3schools.com

//the JS code
$(document).ready(function(){
$(".flip").click(function(){
    $(".panel").slideToggle("slow");
  });
});

<p class="flip">click to view full credit report details</p>
<div class='panel'>                              
 <?php                          
   display_column_name($table_name,$table_id);
 ?>
</div>

好的，所以代码实际上是循环的，它会根据我的数据库中有多少数据而重复，所以现在的问题是当我点击“点击查看完整的信用报告详细信息”时，它会打开所有内容。我想要的是当我点击在那它只打开那部分......而不是其他......关于这个的任何想法？我真的需要帮助谢谢:)

4

2 回答 2

1

每个 p 元素都应该有动态 id。它使用另一个动态设置的 id 调用 div。

在你的循环中你可以这样做

$(document).ready(function(){
$("#flip_<?php echo $id_from_database;?>").click(function(){
    $("#panel_<?php echo $id_from_database;?>").slideToggle("slow");
  });
});

和你的html，这也应该在循环内

<p id="flip_<?php echo $id_from_database;?>">click to view full credit report details</p>
<div id='panel_<?php echo $id_from_database;?>'>                              
 <?php                          
   display_column_name($table_name,$table_id);
 ?>
</div>

或者

第二种方法

这个代码在循环内

<p id="flip_<?php echo $id_from_database;?>" onclick="expandDiv('<?php echo $id_from_database;?>')">click to view full credit report details</p>
    <div id='panel_<?php echo $id_from_database;?>'>                              
     <?php                          
       display_column_name($table_name,$table_id);
     ?>
    </div>

循环外的javascript函数

function expandDiv(id){
   $("#panel_"+id).slideToggle("slow");
}

在哪里

$id_from_database是来自数据库的记录的唯一 ID。

于 2012-11-21T07:10:15.147 回答
1 
<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
    $('.report a').click(function(){
        var id = $(this).attr("id");
        $('.detail').slideUp('slow');
        $('#detail_'+id).slideDown('slow');
    });
});
</script>

<style>
    .detail{display: none;}    
</style>
<div id="reports">

    <div class="report">
        <a id="1" href="#">click to view full credit report details</a>
        <div class="detail" id="detail_1">
            Here are details related to report # 1
        </div>
    </div>
    <div class="report">
        <a id="2" href="#">click to view full credit report details</a>
        <div class="detail" id="detail_2">
            Here are details related to report # 2
        </div>
    </div>
    <div class="report">
        <a id="3" href="#">click to view full credit report details</a>
        <div class="detail" id="detail_3">
            Here are details related to report # 3
        </div>
    </div>
</div>

循环： 在你的循环中，你必须像这样制作动态 id

<div class="report">
    <a id="<?php echo $current_record_id; ?>" href="#">click to view full credit report details</a>
    <div class="detail" id="detail_<?php echo $current_record_id; ?>">
        <?php echo $detail; ?>
    </div>
</div>
于 2012-11-21T07:22:32.273 回答