javascript popup alert on link click

Question

I need a javascript 'OK'/'Cancel' alert once I click on a link.

I have the alert code:

<script type="text/javascript">
<!--
var answer = confirm ("Please click on OK to continue.")
if (!answer)
window.location="http://www.continue.com"
// -->
</script>

But how do I make it so this only runs when clicking a certain link?

score 30 · Answer 1 · edited Jan 11 '12 at 04:26

30

You can use the onclick attribute, just return false if you don't want continue;

<script type="text/javascript">
function confirm_alert(node) {
    return confirm("Please click on OK to continue.");
}
</script>
<a href="http://www.google.com" onclick="return confirm_alert(this);">Click Me</a>

edited Jan 11 '12 at 04:26

Peter O.

32,158
14
82
96

answered Jan 11 '12 at 03:20

muzuiget

1,057
1
10
11

This is actually working much better - more general solution which should be accepted. – jave.web Feb 01 '14 at 10:57

score 20 · Answer 2 · answered Sep 03 '14 at 09:57

Single line works just fine:

<a href="http://example.com/"
 onclick="return confirm('Please click on OK to continue.');">click me</a>

Adding another line with a different link on the same page works fine too:

<a href="http://stackoverflow.com/"
 onclick="return confirm('Click on another OK to continue.');">another link</a>

Okan Kocyigit · Accepted Answer · 2012-01-11T03:22:09.707

18

just make it function,

<script type="text/javascript">
function AlertIt() {
var answer = confirm ("Please click on OK to continue.")
if (answer)
window.location="http://www.continue.com";
}
</script>

<a href="javascript:AlertIt();">click me</a>

edited Jan 11 '12 at 03:22

answered Jan 11 '12 at 03:10

Okan Kocyigit

13,203
18
70
129

@user1022585 you need to `return false` to stop the link from navigating away. See my answer below - the `Confirm` method returns a `boolean` that you can exit your function with... – Alex Jan 11 '12 at 03:18
sorry I copied your code, and your code was wrong. if user say "ok" answer will set "true" than so we don't need to "!", I changed it. – Okan Kocyigit Jan 11 '12 at 03:21
To open blank popup via javascript: jswin = window.open("", "test-window", "width=350,height=150"); – iltaf khalid Mar 29 '16 at 15:54
I have mutiple href tags in my html and i want to perform a different alert popup for every separate link, so how will i know that the javascript is being accessed from which link ?? – Nischaya Sharma Mar 22 '20 at 12:07
1

@NischayaSharma, check @muzuiget's [answer](https://stackoverflow.com/a/8813752/603127). you can't pass `this` inside href. You should use `onclick`, and pass the parameter `this`. – Okan Kocyigit Mar 22 '20 at 12:30

score 4 · Answer 4 · answered Jan 11 '12 at 03:10

In order to do this you need to attach the handler to a specific anchor on the page. For operations like this it's much easier to use a standard framework like jQuery. For example if I had the following HTML

HTML:

<a id="theLink">Click Me</a>

I could use the following jQuery to hookup an event to that specific link.

// Use ready to ensure document is loaded before running javascript
$(document).ready(function() {

  // The '#theLink' portion is a selector which matches a DOM element
  // with the id 'theLink' and .click registers a call back for the 
  // element being clicked on 
  $('#theLink').click(function (event) {

    // This stops the link from actually being followed which is the 
    // default action 
    event.preventDefault();

    var answer confirm("Please click OK to continue");
    if (!answer) {
      window.location="http://www.continue.com"
    }
  });

});

javascript popup alert on link click

4 Answers4

Linked