web-dev-qa-db-fra.com

alerte popup javascript sur le lien

J'ai besoin d'une alerte javascript "OK"/"Annuler" une fois que je clique sur un lien.

J'ai le code d'alerte:

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

Mais comment puis-je faire en sorte que cela ne fonctionne que lorsque vous cliquez sur un certain lien?

javascripthyperlinkalertconfirmconfirmation
18
user1022585

Vous pouvez utiliser l'attribut onclick, juste return false si vous ne voulez pas continuer;

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

Une seule ligne fonctionne très bien:

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

L'ajout d'une autre ligne avec un lien différent sur la même page fonctionne également très bien:

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

Pour ce faire, vous devez attacher le gestionnaire à une ancre spécifique sur la page. Pour des opérations comme celle-ci, il est beaucoup plus facile d'utiliser un cadre standard comme jQuery . Par exemple, si j'avais le code HTML suivant

HTML:

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

Je pourrais utiliser le jQuery suivant pour raccorder un événement à ce lien spécifique.

// 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"
    }
  });

});
3
JaredPar