如何創建多個按鈕來更改內嵌的簡碼

我在我的WordPress網站中創建了許多照片庫，但我只想一次顯示一個照片庫。我正在嘗試創建一系列按鈕/超鏈接，這些按鈕或超鏈接將更改在畫面中顯示的畫廊（而不是彈出頁面）。如何創建多個按鈕來更改內嵌的簡碼

我試過以下（每個<li>是一個不同的嘗試），但沒有任何工作對我來說。誰能幫忙？

<ul> 
    <li><a onClick="document.getElementById('showMe').innerHTML = '[foogallery id=123]'">Gallery 1</a></li> 
    <li><a onClick="document.getElementById('showMe').innerHTML = '<?php echo do_shortcode(\'[foogallery id=234]\'); ?>'">Gallery 2</a></li> 
    <li><a href="<?php echo do_shortcode('[foogallery id=345]'); ?>" target="showMe" >Gallery 3</a></li> 
</ul> 
<div id="showMe"></div>

來源

2017-10-04 timhuk

如果我理解正確的話，試試這個代碼

HTML

<div class="gallery-change-btn"> 
    <button class="btn" data-gallery-id="id-yougallery">Gallery #1</button> 
    <button class="btn" data-gallery-id="id-yougallery">Gallery #2</button> 
    <button class="btn" data-gallery-id="id-yougallery">Gallery #3</button> 
</div>

HTML畫廊

<div class="wrapper-gallery"> 
    <div id="foogallery-gallery-1" class="gallery">qwe1</div> 
    <div id="foogallery-gallery-2" class="gallery">qwe2</div> 
    <div id="foogallery-gallery-3" class="gallery">qwe3</div> 
</div>

<script> 
    jQuery('.gallery-change-btn').on('click', 'button' , function(){ 
    var element = jQuery(this).data('gallery-id'); 
    jQuery('.wrapper-gallery .gallery').each(function (key, value) { 
     if (jQuery(value).attr('id') === ('foogallery-gallery-'+element)) { 
     jQuery(value).show(); 
     return; 
     }else{ 
     jQuery(value).hide(); 
     } 
    }); 
    }); 
</script>

而且您需要包裝您的畫廊wrapper-gallery類

來源

2017-10-05 08:14:28

感謝您的及時響應。我是javascript的新手 - 我如何讓jQuery的結果顯示在我的頁面上？我嘗試過'

'，但我顯然需要更多。 – timhuk

@timhuk請更新您的問題，並附上新代碼 –

對不起，我不明白您的要求。我還需要添加到我的頁面才能顯示畫廊？我知道我需要用'

'包裝畫廊，但還有什麼？ – timhuk

回答

相關問題