How to open links in new window ONLY IF the check box is checked

Question

Here is what i have so far. I have it so they open in new windows, but i want it only if the check box is checked...

<!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>

I am unsure how to actually do the if statement if it is checked then open. It does currently open in a new tab.. i just need it to be only when its checked.

Any help with this will be greatly appreciated! Thanks!

the javascript is broken, you have the `else` outside the function — Einacio, Oct 17 '13 at 15:59
@Einacio This is a great example of why javascript style bracketing can be misleading/difficult to read. — John Lieb-Bauman, Oct 17 '13 at 16:03
I dont think the "javascript" bracketing style can be blamed as to why this doesn't work... thats the least of his worries here — cowls, Oct 17 '13 at 16:05
@cowls It is just something to note for people who are new to javascript and come from java/C style brackets. It is pretty clear that there was some confusion in his original code (in addition to other, more obvious issues). — John Lieb-Bauman, Oct 17 '13 at 16:27
Very true, though at least Java has the same bracketing style — cowls, Oct 17 '13 at 16:28
@jbaum012 A valid point none the less, especially for beginners to look out for — cowls, Oct 17 '13 at 16:58
@cowls, it was my intention to delete the comment to boaz all the time - I just couldt clarify it in that way in a comment. — davidkonrad, Oct 18 '13 at 09:10
@davidkonrad It would still be useful to provide details as to the issues it would cause and in which IE versions, as I too am curious — cowls, Oct 18 '13 at 09:53

score 0 · Answer 1 · edited May 23 '17 at 10:25

0

Not going to rewrite it for you but can hopefully set you on the right path.

Firstly, use target="_blank" to open in a new window, and target="_self" to open in same window.

All you need to do, is add an event listener to the <a> tags that simply checks whether the checkbox is checked and then sets the target attribute accordingly.

I suggest reading up on Javascript event listeners first.

JQuery will make this simpler, but it might be nice to understand the Javascript before moving onto using JQuery.

Some useful links

Adding Event Listeners on Elements - Javascript

check if checkbox is checked javascript

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

edited May 23 '17 at 10:25

Community

1
1

answered Oct 17 '13 at 16:14

cowls

24,013
8
48
78

It is target=_blank, not target="_blank" (dont use quotes) – davidkonrad Oct 17 '13 at 21:56
1

@davidkonrad I'm curious, what are you basing this on? – Boaz Oct 17 '13 at 22:01

Undercover · Answer 2 · 2013-10-17T21:52:01.280

<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>

ooh i forgot to add ele.setAttribute('target','_blank'); in each element creation. thanks — Undercover, Oct 17 '13 at 21:23

How to open links in new window ONLY IF the check box is checked

2 Answers2