讓點擊兒童的div可見

已編輯爲最新版本。

以下是我有：

<body> 
<!-- visibility toggle --> 
<script type="text/javascript"> 
<!-- 
function toggle_visibility() 
    { 
     if(document.getElementById(window.event.srcElement.id+'menu').style.display=='block'){ 
      document.getElementById(window.event.srcElement.id+'menu').style.display='none'; 
     } 
     else{ 
      document.getElementById(window.event.srcElement.id+'menu').style.display='block'; 
     } 
    }; 
//--> 
</script>

這裏是我的div（編輯恰好說明我有）

<ul class="lyrics"><h3>ALL LYRICS</h3> 
    <?php while (have_posts()) : the_post(); ?> 
     <li ><a id="links" href="#" onclick="toggle_visibility();"><?php the_title(); ?></a> 
      <div id="linksmenu"><?php the_content();?></div> 
     </li> 
    <?php endwhile; // End the loop. Whew. ?> 
</ul>

這裏是發生了什麼：無論哪一個環節我點擊，只顯示與最後一個「the_content」關聯的文本。

這是我需要的：最初所有的「孩子」divs不可見。當我點擊「標題1」鏈接時，「子文本1」將變得可見。當我點擊「標題2」鏈接時，「兒童文字2」將變得可見，並且「兒童文字1」將不可見。

這將會出現在WordPress博客中，因此Title div的數量將會發生變化。總會只有一個孩子。

在此先感謝！

來源

2012-06-28 user1488639

你在哪裏調用'toggle_visibility'功能？即您的事件處理程序在哪裏？ – jackwanders

我們需要查看PHP函數的輸出來確定問題。 –

你想讓我們爲你編寫和調試代碼嗎？還是你有特定的問題？ – akonsu

爲什麼您的第一個div被切換，無論您點擊哪個位置，都是因爲您使用了硬編碼的編號foo。通過this到toggle_visibility而不是文字'foo'和裏面toggle_visibility函數找到您要切換的div（這將成爲傳遞參數的第一個孩子）。

來源

2012-06-28 15:04:23 akonsu

這是因爲你打電話給the_content()兩次。我假設你的文件看起來像：

<?php get_header(); 
if (have_posts()) : while (have_posts()) : the_post(); ?> 
<ul> 
<li class="main"><a href="#" title="Title 1"><?php the_title(); ?></a> <div class="child"><?php the_content(); ?></div> </li> 
<li class="main"><a href="#" title="Title 2"><?php the_title(); ?></a> <div class="child"><?php the_content(); ?></div> </li> <ul> 
<?php endwhile; else: ?> 
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p> 
<?php endif; ?>

你需要有兩個循環，但沒有看到更多的代碼，我不能提供細節。閱讀關於multiple loops。

來源

2012-06-28 13:58:47

謝謝你的回覆。我在原帖中添加了附加信息。 – user1488639

將參數丟棄並使用觸發事件的元素的ID來構建要設置爲可見/不可見的標識。

function toggle_visibility() 
     { 
      if(document.getElementById(window.event.srcElement.id+'menu').style.display=='block'){ 
       document.getElementById(window.event.srcElement.id+'menu').style.display='none'; 
      } 
      else{ 
       document.getElementById(window.event.srcElement.id+'menu').style.display='block'; 
      } 
     };

而且只要你想始終顯示事物都有一個ID +「菜單」或什麼的，你可以用函數表現出來。（請注意，父有ID links和孩子有ID linksmenu）

<ul class="lyrics"><h3>ALL LYRICS</h3> 
    <?php while (have_posts()) : the_post(); ?> 
    <li ><a id="links" href="#" onclick="toggle_visibility();"><?php the_title(); ?></a> 
     <div id="linksmenu"><?php the_content();?></div> 
    </li> 
    <?php endwhile; // End the loop. Whew. ?> 
</ul>

來源

2012-06-28 15:09:32 CosminO

上述代碼僅顯示最後一個「linksmenu」文本，無論點擊哪個鏈接。例如：我有鏈接1，鏈接2，如果我單擊鏈接1，則獲得鏈接1文本，如果單擊鏈接2，則獲取鏈接1文本。 – user1488639

，你有link1menu，link2menu等？ – CosminO

讓點擊兒童的div可見

回答

相關問題