仅在选中复选框时如何在新窗口中打开链接答案

【问题标题】：How to open links in new window ONLY IF the check box is checked仅在选中复选框时如何在新窗口中打开链接
【发布时间】：2013-10-17 15:57:16
【问题描述】：

这是我目前所拥有的。我有它，所以它们会在新窗口中打开，但只有在选中复选框时我才想要它...

<!DOCTYPE html>
<html>
<head>

<script>
    function new() {
       if ( document.getElementById('checkbox').checked )
            window.open( 'y', 'n', 't', 'New Window' );
    }
    else
    {
        break;
    }

    var OpenNew = document.getElementById('opennew');
    OpenNew.addEventListener('click', OpenWin, false );
</script>
</head>
<body>

<p>
<form name="test">
<p>Open link in a new window &nbsp; <input type="checkbox" id="checkbox" name="check" /></p>
</form>
</p>
<p>
<h2>My favorite Websites to visit</h2>
<a href="http://www.youtube.com" target="new" id="y">Youtube</a><br />
<a href="http://www.newegg.com" target="new" id="n">Newegg</a><br />
<a href="http://www.twitch.tv" target="new" id="t">Twitch.tv</a><br />
</p>












</body>

</html>

如果检查然后打开，我不确定如何实际执行 if 语句。它目前确实在一个新选项卡中打开。我只需要在它被选中时才打开它。

对此的任何帮助将不胜感激！谢谢！

【问题讨论】：

javascript坏了，函数外有else
如果未选中复选框会发生什么？
@Einacio 这是一个很好的例子，说明了为什么 javascript 样式的括号会产生误导/难以阅读。
我不认为“javascript”括号样式可以归咎于为什么这不起作用......这是他最不担心的问题
@cowls 对于刚接触 javascript 并且来自 java/C 风格括号的人来说，这只是需要注意的一点。很明显，他的原始代码存在一些混乱（除了其他更明显的问题）。

标签： javascript html forms function

【解决方案1】：

不会为你重写它，但希望能让你走上正确的道路。

首先使用target="_blank"在新窗口中打开，target="_self"在同一窗口中打开。

您需要做的就是向<a> 标签添加一个事件侦听器，它只检查复选框是否被选中，然后相应地设置目标属性。

我建议先阅读 Javascript 事件侦听器。

JQuery 将使这更简单，但在继续使用 JQuery 之前了解 Javascript 可能会很好。

一些有用的链接

Adding Event Listeners on Elements - Javascript

check if checkbox is checked javascript

http://www.java2s.com/Code/JavaScript/HTML/Changethetargetattributeofalink.htm

【讨论】：

这是 target=_blank，而不是 target="_blank"（不要使用引号）
@davidkonrad 我很好奇，你的依据是什么？

【解决方案2】：

<p>Open link in a new window &nbsp; <input type="checkbox" id="checkbox" name="check" onclick="ss()"/></p>

<span id="w">Youtube</span><br />
<span id="qq">Newegg</span><br />
<span id="aa">Twitch.tv</span><br /> 

<script>
  function ss() {
    if (document.getElementById('checkbox').checked) {

      for (i = 0; i < 3; i++) {
        var clear = document.getElementsByTagName("span")[i]
        clear.innerHTML = "";
      }

      var d = document.getElementById("w");
      var ele = document.createElement("a");
      var t = document.createTextNode("Youtube");
      ele.setAttribute('href', 'http://www.youtube.com');
      ele.appendChild(t);
      d.appendChild(ele);

      var d2 = document.getElementById("qq");
      var ele2 = document.createElement("a");
      var t2 = document.createTextNode("Newrag");
      ele2.setAttribute('href', 'http://www.newegg.com');
      ele2.appendChild(t2);
      d2.appendChild(ele2);

      var d3 = document.getElementById("aa");
      var ele3 = document.createElement("a");
      var t3 = document.createTextNode("Twich.tv");
      ele3.setAttribute('href', 'http://www.twitch.tv');
      ele3.appendChild(t3);
      d3.appendChild(ele3);

    }
  }
</script>

【讨论】：

哦我忘了添加 ele.setAttribute('target','_blank');在每个元素创建中。谢谢