foreachループをクリックしてXMLコンテンツを表示/非表示にする

Question

私はこれに不満を持っています。私がコードしようとしているのは、ユーザーが表示または非表示のデータを選択できる単純なxmlリーダーです。

最初にこのコードはxmlファイルのタイトルを示し、ユーザーがタイトルをクリックすると、タイトルの下に日付と時刻が表示されます。

問題は、どのタイトルをクリックしても、最初のタイトルの最初のタイトルの日時のみを表示/非表示にすることです。 idsは、ページ上で一意である必要があり、そう

document.getElementById(element) 

は常にページ

Answer 1

他にも述べたように、要素ごとに一意のID（参照先を取得する必要があります）が必要です。

<script type="text/javascript"> 
    function toggle(num) { 
    document.getElementById("shit" + num).style.display =  
(document.getElementById("shit" + num).style.display == "none") ? "" : "none"; 
} 
</script> 

<?php 
$doc = simplexml_load_file('data.xml'); 
if($doc == TRUE){ 
$1 = 0; 
foreach($doc->channel->item as $child){ 
    $title = $child->title; 
    echo '<table>'; 
    echo '<tr>'; 
    echo '<td><a href="javascript:toggle(\''.$i.'\')">'.$title.'</a></td></tr>'; 
    echo '<tr id="shit'.$i.'" style="display: none;">'; 
    echo '<td>'; 
    echo date("d.m.Y H:i", strtotime($child->pubDate)); 
    echo '</td></tr>'; 
    echo '</table>'; 
} 
} 
?> 

Answer 2

これがあります表示/非表示にするすべてのTRに異なる（一意の）IDを割り当てる必要があります。今、あなたは同じid "shit"を持つ多くのTRを出力しています。

正しいIDを使用するには、JavaScriptを変更する必要があります。

Answer 3

あなたの同じIDの複数の要素が存在する場合であっても、最初に一致した要素を返すbecaus

<script type="text/javascript"> 
    function toggle(element) { 
    document.getElementById(element).style.display =  
(document.getElementById(element).style.display == "none") ? "" : "none"; 
} 
</script> 

<?php 
$doc = simplexml_load_file('data.xml'); 
if($doc == TRUE){ 
foreach($doc->channel->item as $child){ 
    $title = $child->title; 
    echo '<table>'; 
    echo '<tr>'; 
    echo '<td><a href="javascript:toggle(\'shit\')">'.$title.'</a></td></tr>'; 
    echo '<tr id="shit" style="display: none;">'; 
    echo '<td>'; 
    echo date("d.m.Y H:i", strtotime($child->pubDate)); 
    echo '</td></tr>'; 
    echo '</table>'; 
} 
} 
?>