display：none无法在移动设备上运行

Question

我在DIV中有表格，当页面最初加载时，设置了'display: none'。

有一个下拉菜单，当选择一个项目时会显示DIV。

此功能在计算机上运行正常，但在移动设备上无效。

我只想要一种非常简单的方法来完成这项工作，即使它没有使用相同的方法。

<div id="this_div" style="display: none"> ... </div>

JavaScript的：

function unHide() {
    document.getElementById('this_div').style = "";
}

Answer 1

您确定您的移动浏览器上的javascript是否有效？ 尝试在函数中添加alert("Javacript is ON")来检查这一点。

我通常会在其他人的代码中看到使用“display：none”和“visibility：hidden”。您的移动浏览器可能比单独的“显示”更好地理解此命令......因此应该测试两者。

为了保持代码简单明了，我建议你定义一个隐藏元素的css类：

.hidden {
    display:none;
    visibility:hidden;
}

只需添加或删除此类即可完成工作。添加：

document.getElementById("this_div").className += " hidden"

删除：

document.getElementById("this_div").className.replace(/\bhiddden\b/,'');

因此HTML标签中不再有'style =“”'，只有class和id定义。

如果您不介意使用jQuery，它肯定会减少您的许多困难（并使您编写更少的代码！）