[英]JavaScript close already open div
我給了我的每個div容器一個唯一的ID和一些JavaScript。 因此,我可以單擊以顯示/隱藏我正在查看的頁面上的每個配方,但是當新的div打開時,我想通過JavaScript關閉任何已經打開的div。 我包含一些提取的代碼,而不是粘貼整個文檔,因為它很大,下面也是實時網址:
* update- <?=$counter_recipes;?>
僅產生一個唯一的數字。 $ i ++方法,然后在頁面的上方。
實時網址-http: //bit.ly/1hQuzRI
<h3 class="box2-title"><?php echo $row_rsCatalogue['pageTitle']; ?></h3>
<a style="color:#000" class="show_hide<?=$counter_recipes;?>">Show/hide</a>
<script type="text/javascript">
$(document).ready(function(){
$("#box_to_show<?=$counter_recipes;?>").hide();
$(".show_hide<?=$counter_recipes;?>").show();
$('.show_hide<?=$counter_recipes;?>').on('click',function(){
$("#box_to_show<?=$counter_recipes;?>").slideToggle();
});
});
</script>
<div class="box2-content" id="box_to_show<?=$counter_recipes;?>">
<p><?php echo $row_rsCatalogue['pageSubTitle']; ?></p>
<?php
if ($row_rsCatalogue['pageId']){
$rsPriceMatrix = $db->select('pageOption',array('pageId'=>$db->mes($row_rsCatalogue['pageId'])),array('sort'=>'ASC','name'=>'ASC'));
$ingredients = '';
while ($row_rsPriceMatrix = $rsPriceMatrix->get_row_assoc()){
$ingredients .= $row_rsPriceMatrix['name'].', ';
}
$ingredients = rtrim($ingredients,', ');
echo '<p>'.$ingredients.'</p>';
}
?>
如果需要,我可以粘貼更多。
根據您的代碼:
$('.show_hide<?=$counter_recipes;?>').on('click',function(){
//Hide open divs!
$("[id^=box_to_show]:visible").slideUp();
//slide down
$("#box_to_show<?=$counter_recipes;?>").slideToggle();
});
一種簡單得多的方法是為打開和關閉的div提供一個通用類,然后只需調用$(".someClass:visible").slideUp();
在函數的開頭。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.