Показать/скрыть DIV с помощью триггера с определенным классом для переключения DIV с таким же классом

У меня есть мой triggers и divs, чтобы показать/скрыть в цикле в то время, вместо того, чтобы использовать div id, который должен уникальным, я решил использовать div class для показать/скрыть группу контента среди других.Показать/скрыть DIV с помощью триггера с определенным классом для переключения DIV с таким же классом

, что я пытаюсь достичь:

я не совсем хорошо с JavaScript, и я пытался добиться этого в течение нескольких дней. Скажем, у меня есть триггер с div class="view1-'.$id1.'", где $id1=2 и div class="licom-'.$cc_id.'" где $cc_id=2 показать/скрыть, можно ли убедиться, что мой триггер будет показывать/скрывать div class с тем же идентификатором, что и 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>

info.php

<?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...... 

} 
    } 
    } 
?>

как я заново написать свой JavaScript, чтобы все DIV класса "licom" по умолчанию скрыты, и только ДИВ с тем же идентификатором, что и триггер, скажем, 2,3,..., так как это может показаться/скрыть onClick.

источник

2015-07-31 Al3x Osaz

Что-то вроде: http://jsfiddle.net/qjadyznh/? – jvv

@jvv, удивительный. оно работает. отправьте свой ответ, чтобы я мог его принять. –

Просто сделал, рад, что это сработало для вас :) – jvv

В соответствии с просьбой в комментариях к вопросу:

"Что-то вроде: 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'); 
    } 
})

Простой пример о том, как достичь цели.

источник

2015-07-31 14:27:12 jvv

Вы можете использовать toggle() для меньшего количества кода. http://jsfiddle.net/5L1fskzv/ – egze

Показать/скрыть DIV с помощью триггера с определенным классом для переключения DIV с таким же классом

ответ

Смежные вопросы