javascript - 单击链接时显示带有 JavaScript 的确认弹出窗口

Question

如何创建其中一个超链接，当您单击它时，它会显示一个弹出窗口，询问“您确定吗？”

<INPUT TYPE="Button" NAME="confirm" VALUE="???" onClick="message()">

我已经有一个 message() 函数在工作。我只需要知道超链接的输入类型是什么。

Answer 1

<a href="http://somewhere_else" onclick="return confirm()">

When the user clicks the link, the confirm function will be called. If the confirm function returns false, the link traversal is cancelled, if true is returned, the link is traversed.

Answer 2

<a href="http://something.com" onclick="return confirmAction()">try to click, I dare you</a>

与功能

function confirmAction(){
      var confirmed = confirm("Are you sure? This will remove this entry forever.");
      return confirmed;
}

（您也可以立即返回确认，为了便于阅读，我将其分开）

在 FF、Chrome 和 IE 中测试

Answer 3

As Nahom said, except I would put the javascript:message() call directly in the href part (no need for onclik then).

Note: leaving the JavaScript call in the onClick has a benefit: in the href attribute, you can put a URL to go to if the user doesn't have JavaScript enabled. That way, if they do have JS, your code gets run. If they don't, they go somewhere where they are instructed to enable it (perhaps).

Now, your message routine must not only ask the question, but also use the answer: if positive, it must call submit() on the form to post the form. You can pass this in the call to ease the fetching of the form.

Personally, I would go for a button (input tag as you show) instead of a simple link to do the process: it would use a more familiar paradigm for the users.

[EDIT] Since I prefer to verify answers I give, I wrote a simple test:

<script type="text/javascript" language="JavaScript">
function AskAndSubmit(t)
{
  var answer = confirm("Are you sure you want to do this?");
  if (answer)
  {
    t.form.submit();
  }
}
</script>

<form action="Tests/Test.html" method="GET" name="subscriberAddForm">
<input type="hidden" name="locationId" value="2721"/>
<input type="text" name="text" value="3.1415926535897732384"/>
<input type="button" name="Confirm" value="Submit this form" onclick="AskAndSubmit(this)"/>
</form>

Yes, the submit just reload the page here... Tested only in FF3.

[EDIT] Followed suggestion in the comments... :-)

Answer 4

<a href="#" onclick="message(); return false;">???</a>

只有当点击不需要将用户导航到另一个页面时，这个答案才可以。