使用具有特定类的触发器显示/隐藏div以使用相同的类切换div

时间:2015-07-31 14:10:34

标签: javascript php jquery loops

我让我的triggersdivs在while循环中显示/隐藏,而不是使用必须唯一的div id,我决定使用{{1显示/隐藏一组内容等。

我想要实现的目标:

我对javascript一点都不好,而且我已经尝试了好几天。假设我有div class的触发器,其中div class="view1-'.$id1.'"$id1=2显示/隐藏div class="licom-'.$cc_id.'",是否可以确保我的触发器仅显示/隐藏{{ 1}}与$cc_id=2具有相同的ID?。

的JavaScript

div class

info.php的

2

如何重新编写我的JavaScript以便默认隐藏类<html> <head> <script language="JavaScript"> $(document).ready(function(){ var showText='View all replies'; var hideText='Hide'; // initialise the visibility check var is_visible = false; // append show/hide links $('.view1').prev().append(); $(".licom").hide(); $(".view1").click(function(){//i need to pass the div class with the variable // switch visibility is_visible = !is_visible; // change the link depending on whether the element is shown or hidden $(this).html( (!is_visible) ? showText : hideText); //i also need to pass the right div class with the right variable, and keep the others hidden $('.licom').toggle(function() { $(this).closest('view1').find('.licom').hide(); return false; }, function() { $(this).closest("view1").next(".licom").show(); return false; }); }); }); </script> </head> <body> </body> </html> 的所有div,并且只有与触发器具有相同id的div说 <?php ........... $stmt = $conn->prepare( "SELECT * FROM comment WHERE post_id = :pid "); $stmt->bindParam(":pid", $type_id, PDO::PARAM_INT); $stmt->execute(); while($obj = $stmt->fetch()){ $username = $obj['user_name']; $comment = $obj['comment']; $id1 = $obj['id']; $userimage = $obj['user_image']; echo '<div class="txt">'; echo '<div class="comment-container">'; echo '<div class="comment-item">'; echo '<div class="comment-avatar">'; echo '<img src="user/user_images/'.$userimage.'" alt="avatar">'; echo '</div>'; echo '<div class="comment-post">'; echo '<span style="font-weight:bold;">'.$username.'&nbsp&nbspsaid.... </span>'; echo '<p style="margin-left:-11px;">'.$comment.'</p>'; echo '<input type="hidden" name="comment_id" value="'.$id.'">'; //trigger to hide/show replies echo '<span class="view1-'.$id1.'" style="float:right;margin-top:-15px;">View all replies</span>'; // echo '</div>'; echo '</div>'; echo '</div>'; echo '</div>'; echo '</div>'; //Relpy to comment, show only the first row $rep = $conn->prepare("SELECT * FROM reply WHERE comment_id = :comid LIMIT 1"); $rep->bindParam(":pid", $id1, PDO::PARAM_INT); $rep->execute(); while($obj = $rep->fetch()){ //...........same output as first without the view all replies trigger...... //Relpy to comment, show from row 2- $rep = $conn->prepare("SELECT * FROM reply WHERE comment_id = :comid LIMIT 1,18446744073709551615"); $rep->bindParam(":pid", $id1, PDO::PARAM_INT); $rep->execute(); while($obj = $rep->fetch()){ $cc_id = $obj['comment_id']; //div to show/hide echo '<div class="licom-'.$cc_id.'">'; //...........same output as first without the view all replies trigger...... } } } ?> ,因为情况可能会显示/隐藏onClick。

1 个答案:

答案 0 :(得分:1)

根据问题评论的要求:

“类似于:http://jsfiddle.net/qjadyznh/?”

$('a').click(function(){
    var id = $(this).attr('id');
    if($('.'+id).css('display') == 'none')
    {
        $('.'+id).css('display','block');
    }
    else
    {
        $('.'+id).css('display','none');
    }
})

关于如何实现所需目标的简单示例。