3

所以我有 2 个链接，我想显示 javascript 是否打开并在关闭时隐藏，当 javascript 关闭时，我想在其位置显示 2 个带有 noscript 标记的其他链接。

到目前为止，我所拥有的是：

-js here- 如果 js 打开则显示 2 个链接，并在禁用时隐藏 -js here-

-noscript- 链接 1 链接 2 -noscript-

我只有 PHP 方面的经验，对 javascript 不是很熟悉。

解决此问题的最佳方法是什么？是否应该有某种 javascript 函数来使显示/隐藏功能起作用？但是如果关闭了 javascript，该函数将如何运行以隐藏链接？

如果有人能指出我正确的方向来解决这个问题或为我提供一个简单的代码片段，我将不胜感激。谢谢！

4

3 回答 3

3

  1. 使用 CSS 隐藏链接 - 默认情况下不可见

    <a id="link1" href="#" style="display: none">Script link 1</a>
<a id="link2" href="#" style="display: none">Script link 2</a>

  2. 使用 Javascript 显示链接 - 当然，它们仅在 Javascript 开启时可见

    <script type="text/javascript">
     document.getElementById('link1').style.display="block";
     document.getElementById('link2').style.display="block";
</script>

    根据您的需要，您可以使用任何其他display属性（链接inline默认情况下，我block在这里添加，使用任何您需要的）。

  3. 添加noscript东西 - 仅在关闭 Javascript 时可见

    <noscript>
-two other links-
</noscript>
于 2012-08-30T22:03:40.467 回答
3

我经常看到这是通过 BODY 标签上的 CSS 类来完成的。例如：

<html>
<head>
  <style type="text/css">
    BODY A { display: none; }
    BODY.script A { display: inherit; }
  </style>
</head>
<body>
    <a href="#">Shows with Script</a>
</body>
</html>

然后，您可以使用该脚本：

document.body.className = 'script';

对于支持 Javascript 的浏览器，script将添加 CSS 类并BODY.script使用样式。否则，BODY将使用常规样式。

然后，您可以准确定义页面上的任何元素在启用或不启用脚本的情况下如何显示。同样，您可以将其反转并赋予 BODYnoscript样式，然后通过脚本将其删除。

JSFiddle 链接

于 2012-08-30T22:06:32.767 回答
0

您也可以不使用noscript，如下所示

HTML 

<a href="" style="display:none" id='javascript_link1'>JS link-1</a>
<a href="" style="display:none" id='javascript_link2'>JS link-2</a>
<a  href="" id='nonjs_link1'>link-1</a>
<a href="" id='nonjs_link2'>link-2</a>

JS

document.getElementById('javascript_link1').style.display="block";
document.getElementById('javascript_link2').style.display="block";
document.getElementById('nonjs_link1').style.display="none";
document.getElementById('nonjs_link2').style.display="none";​

演示。

于 2012-08-30T22:13:23.130 回答