Отображать всплывающее окно подтверждения с JavaScript при нажатии на ссылку

Как мне сделать одну из тех гиперссылок, где при нажатии на нее будет отображаться всплывающее окно с вопросом «Вы уверены?»

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

У меня уже работает функция message(). Мне просто нужно знать, каким будет тип ввода для гиперссылки.


javascript user-interface html popup
person Community    schedule 16.11.2008    source источник

Ответы (4)


arrow_upward
23
arrow_downward 

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

Когда пользователь щелкнет ссылку, будет вызвана функция confirm. Если функция подтверждения возвращает false, обход ссылки отменяется, если возвращается true, ссылка проходится.

person JacquesB    schedule 16.11.2008

arrow_upward
15
arrow_downward 

<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

person marcgg    schedule 11.06.2009
comment
Ваше решение сработало для меня, возможно, потому, что я повторял ссылку href из php. Спасибо! - person Daydah; 27.06.2012

arrow_upward
2
arrow_downward

Как сказал Нахом, за исключением того, что я бы поместил вызов javascript:message() непосредственно в часть href (тогда нет необходимости в onclick).

Примечание. Если оставить вызов JavaScript в onClick, есть одно преимущество: в атрибуте href вы можете указать URL-адрес для перехода, если у пользователя не включен JavaScript. Таким образом, если у них есть JS, ваш код будет запущен. Если они этого не делают, они идут куда-то, где им указано включить его (возможно).

Теперь ваша подпрограмма message должна не только задать вопрос, но и использовать ответ: если он положительный, она должна вызвать submit() в форме, чтобы опубликовать форму. Вы можете передать this в вызове, чтобы облегчить выборку формы.

Лично я бы выбрал кнопку (тег ввода, как вы показываете) вместо простой ссылки для выполнения процесса: он использовал бы более знакомую парадигму для пользователей.

[EDIT] Поскольку я предпочитаю проверять ответы, которые даю, я написал простой тест:

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

Да, отправить просто перезагрузить страницу здесь... Проверено только в FF3.

[EDIT] Следовал предложению в комментариях... :-)

person PhiLho    schedule 16.11.2008
comment
t.parentNode подходит для этого примера, но он ненадежен, поскольку содержит предположение. Лучше t.form. - person Tomalak; 16.11.2008

arrow_upward
0
arrow_downward 

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

Этот ответ подходит только тогда, когда щелчок НЕ требует перехода пользователя на другую страницу.

person Nahom Tijnam    schedule 16.11.2008