JavaScript 隐藏显示

Question

我正在尝试用 javascript 做一个简单的隐藏和显示功能（不是 Jquery，我想学习）；是的，我还在学习。我想做的是 Facebook 和其他应用程序，当你将鼠标悬停在新闻提要文章上时，会显示一个小 X，可以作为删除该文章的选项。我试图在表格（表格单元格）上执行此操作，

这是我的标题函数：

function showHide(id) {
    if(document.getDocumentById(id).style.visibility == 'hidden')
        document.getDocumentById(id).style.visibility = 'visible';
    else
        document.getDocumentById(id).style.visibility = 'hidden';
}

在正文（php）中：

echo '<tr>';
        echo '<td class="managealbum_delete" id="managealbum_delete'.$x.'">X</td>';
        echo '<td>' . $album->title . '</td>';
        echo '<td>' . $album->caption . '</td>';
        echo '<td style="border: 1px solid black;" onMouseOver="showHide('."'".'managealbum_delete'.$x."'".');" onMouseOut="showHide('."'".'managealbum_delete'.$x."'".');">' . $album->media . '</td>';
        echo '</tr>';

Answer 1

该函数是 getElementById，而不是 getDocumentById

function showHide(id) { 
    if(document.getElementById(id).style.visibility == 'hidden')    
        document.getElementById(id).style.visibility = 'visible'; 
    else 
        document.getElementById(id).style.visibility = 'hidden'; 
}

另外，您可以稍微缩短它，并检查以确保找到一个元素，如下所示：

function showHide(id) {
    var el = document.getElementById(id);
    if( el && el.style.visibility == 'hidden')    
        el.style.visibility = 'visible'; 
    else 
        el.style.visibility = 'hidden'; 
}

Answer 2

好吧，如果您确实想隐藏它而不仅仅是删除其内容，您应该使用：

document.getDocumentById(id).style.display = 'none';

要显示它（TD），请使用：

document.getDocumentById(id).style.display = 'table-cell';

http://www.w3schools.com/cssref/pr_class_display.asp