按下按钮确认的JavaScript警告框

Question

我有这个链接:

<p id="accept-favor"><a title="Accept this Favor" href="?wp_accept_favor=<?php comment_ID(); ?>">Accept this Favor</a></p>

我想在用户点击它时显示一个JavaScript警告框:"您确定要接受此回复作为您的帮助吗？" 有两个按钮,一个说"是",这将允许该功能运行,另一个说"否",这将取消回发并保持用户在页面上.

我该怎么做？谢谢 :)

Answer 1

您可以通过确认onclick轻松完成:

<p id="accept-favor"><a title="Accept this Favor" 
  href="?wp_accept_favor=<?php comment_ID(); ?>" 
  onclick="return confirm('Are you sure you would like to accept this reply as your favor?');"
  >Accept this Favor</a></p>

虽然这会说OK/Cancel而不是Yes/No. 如果你真的想要是/否,你将不得不使用自定义对话框.

Answer 2

你可以写onclick="return confirm('Are you sure?');".

该confirm功能显示"确定/取消"对话框,并true在用户单击"确定"时返回.
return荷兰国际集团false从一个onclick处理器将取消点击的默认操作.

Answer 3

你可以使用这个功能:

myFunction() {
     var x;
     if (confirm("Are you sure?") == true) {
         x = "You pressed OK!";
     } else {
         x = "You pressed Cancel!";
     }
     return x; 
}
myFunction();

Answer 4

由于其他答案谈论直接onclick，我想使用addEventListener和preventDefault方法提出一个“更好”（IMO=在我看来）版本的解决方案。因为这样你就可以绑定更多的点击处理程序。

超文本标记语言

<a href="#" id="confirmClickActionElementId">click me</a>

JavaScript

document
    .getElementById("confirmClickActionElementId")
    .addEventListener("click", function( e ){ //e => event
        if( ! confirm("Do you really want to do this?") ){
            e.preventDefault(); // ! => don't want to do this
        } else {
            //want to do this! => maybe do something about it?
            alert('Ok, lets do this!');
        }
    });

小提琴： http: //jsfiddle.net/ouyf86ya/

...或者旧的“ return”方式：

document
    .getElementById("confirmClickActionElementId")
    .addEventListener("click", function(  ){ 
        return confirm("Do you really want to do this?") ;
    });

小提琴： http: //jsfiddle.net/y2jLpkbb/