Окно предупреждения JavaScript с подтверждением при нажатии кнопки

У меня есть эта ссылка:

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

Я хочу показать окно предупреждения JavaScript, когда пользователь нажимает на него и говорит: «Вы уверены, что хотите принять этот ответ в качестве своей услуги?» с двумя кнопками, одна из которых говорит «Да», что позволит запустить функцию, а другая говорит «Нет», что просто отменяет обратную передачу и удерживает пользователя на странице.

Как бы я это сделал? Спасибо :)


person Cameron    schedule 10.02.2011    source источник


Ответы (4)


Вы можете легко сделать это с подтверждением при нажатии:

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

Хотя вместо Да/Нет будет написано ОК/Отмена. Если вы действительно хотите Да/Нет, вам придется использовать собственный диалог.

person Kaleb Brasee    schedule 10.02.2011
comment
Вам не хватает закрывающей скобки. Код onClick должен быть onclick="return confirm('Are you sure you would like to accept this reply as your favor?');" - person TMC; 13.01.2012

Вы можете написать onclick="return confirm('Are you sure?');".

Функция confirm показывает диалоговое окно "ОК/Отмена" и возвращает true, если пользователь нажал кнопку "ОК". .
returning false из обработчика onclick отменит действие щелчка по умолчанию.

person SLaks    schedule 10.02.2011

Вы можете использовать эту функцию:

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

Поскольку в других ответах говорится о прямом onclick, я хотел бы представить решение для «более приятной» (IMO = на мой взгляд) версии с использованием методов addEventListener и preventDefault. Потому что таким образом вы можете связать больше обработчиков click.

HTML

<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/

person jave.web    schedule 11.03.2015