I have Created a Button With Link Which opens in new tab. I have also used javascript to alert.

Currently this code is working perfectly. But After Clicking OK in Alert, user stays on same page. But I Want To Move User To New Opened Tab. Is it possible ?

My Code Is -

<form><input type="button" id="anchor1" style="cursor:pointer" value="Click Here" onClick="window.open(href='')"></form> 

<script type="text/javascript">
  var anchor = document.getElementById('anchor1');
    // or anchor = getElementsByTagName('a') then do ('a')[0]

    anchor.addEventListener('click', doSomething, false);

    function doSomething() {
        alert('You Are About To Open New Tab');
    }
</script>

Help Needed

Here Is My JSFIDDLE

I have Created a Button With Link Which opens in new tab. I have also used javascript to alert.

Currently this code is working perfectly. But After Clicking OK in Alert, user stays on same page. But I Want To Move User To New Opened Tab. Is it possible ?

My Code Is -

<form><input type="button" id="anchor1" style="cursor:pointer" value="Click Here" onClick="window.open(href='http://www.google.')"></form> 

<script type="text/javascript">
  var anchor = document.getElementById('anchor1');
    // or anchor = getElementsByTagName('a') then do ('a')[0]

    anchor.addEventListener('click', doSomething, false);

    function doSomething() {
        alert('You Are About To Open New Tab');
    }
</script>

Help Needed

Here Is My JSFIDDLE

• javascript
• html

• Why are you using a button and window.open instead of <a href="..." target="_blank">? – Quentin Commented Jul 12, 2014 at 16:31
• As per my website look, Button Needed.... – darshan Commented Jul 12, 2014 at 16:32
• Use CSS to describe how the website should look, not inappropriate markup. – Quentin Commented Jul 12, 2014 at 16:33

3 Answers 3

This one is super simple.

You need to remove the onclick attribute from the input tag.

Then, put your code to open new tab using JS after your alert line.

<form><input type="button" id="anchor1" style="padding:5px; cursor:pointer" value="Click Here"></form> 

In your JS code, do this:

var anchor = document.getElementById('anchor1');

anchor.addEventListener('click', doSomething, false);

function doSomething() {
    alert('You Are About To Open New Tab');
    var win = window.open("http://google.", '_blank');
    win.focus();
}

Fiddle

Style the anchor tag by changing the text color to black and changing text-decoration to none:

<button><a href="http://www.google." target="_blank">Click here</a></button>

HTML

<form><input type="button" id="anchor1" style="padding:5px; cursor:pointer" value="Click Here" ></form> 

JS

var anchor = document.getElementById('anchor1');
// or anchor = getElementsByTagName('a') then do ('a')[0]

anchor.addEventListener('click', doSomething, false);

function doSomething() {
    alert('You Are About To Open New Tab');
    window.open(href='http://www.google.')                
}