Простая проблема с JavaScript: onClick подтверждает, что не предотвращает действие по умолчанию

Я делаю простую ссылку для удаления с событием onClick, которое вызывает диалоговое окно подтверждения. Я хочу подтвердить, что пользователь хочет удалить запись. Однако кажется, что при нажатии кнопки «Отмена» в диалоговом окне действие по умолчанию (т.е. ссылка href) все еще выполняется, поэтому запись все равно удаляется. Не уверен, что я здесь делаю неправильно ... Любой вклад будет очень признателен.

Обновлено: На самом деле, как сейчас код, страница даже не выполняет вызов функции ... так что диалоговое окно не появляется вообще. У меня был код onClick как:

onClick = "confirm('Delete entry?')"

Который вызвал диалог, но по-прежнему переходил по ссылке на Отмена.

<%@ taglib prefix = "c" uri = "http://java.sun.com/jstl/core_rt"%>
<%@ taglib prefix = "fmt" uri = "http://java.sun.com/jstl/fmt_rt"%>
<%@ taglib uri = "http://java.sun.com/jsp/jstl/functions" prefix = "fn" %>

<script type = "text/javascript">

function delete() {
    return confirm('Delete entry?')
}

</script>


...

<tr>
 <c:if test = "${userIDRO}">
    <td>
        <a href = "showSkill.htm?row=<c:out value = "${skill.employeeSkillId}"/>" />
        <img src = "images/edit.GIF" ALT = "Edit this skill." border = "1"/></a>
    </td>
    <td>
        <a href = "showSkill.htm?row=<c:out value = "${skill.employeeSkillId}&remove=1"/>" onClick = "return delete()"/>
        <img src = "images/remove.GIF" ALT = "Remove this skill." border = "1"/></a>
    </td>
 </c:if>
</tr>

Асинхронная передача данных с помощью sendBeacon в JavaScript
Асинхронная передача данных с помощью sendBeacon в JavaScript
В современных веб-приложениях отправка данных из JavaScript на стороне клиента на сервер является распространенной задачей. Одним из популярных...
Принципы ООП в JavaScript
Принципы ООП в JavaScript
Парадигма объектно-ориентированного программирования имеет 4 основных принципа,
Laravel с Turbo JS
Laravel с Turbo JS
Turbo - это библиотека JavaScript для упрощения создания быстрых и высокоинтерактивных веб-приложений. Она работает с помощью техники под названием...
Слишком много useState? Давайте useReducer!
Слишком много useState? Давайте useReducer!
Современный фронтенд похож на старую добрую веб-разработку, но с одной загвоздкой: страница в браузере так же сложна, как и бэкенд.
Типы данных JavaScript
Типы данных JavaScript
В JavaScript существует несколько типов данных, включая примитивные типы данных и ссылочные типы данных. Вот краткое объяснение различных типов данных...
CSS Flex: что должен знать каждый разработчик
CSS Flex: что должен знать каждый разработчик
CSS Flex: что должен знать каждый разработчик Модуль flexbox, также известный как гибкий модуль разметки box, помогает эффективно проектировать и...
46
0
222 965
10
Перейти к ответу Данный вопрос помечен как решенный

Ответы 10

Я использую это, работает как шарм. Нет необходимости иметь какие-либо функции, просто вставьте ссылку (-ы)

onclick = "javascript:return confirm('Are you sure you want to delete this comment?')"

Также нет необходимости использовать "javascript:". Но, как сказал Сюкурнин, вы должны использовать POST, если что-то измените.

some 03.12.2008 01:56

Прежде всего, Удалить - это зарезервированное слово в javascript, я удивлен, что это даже выполняется для вас (когда я тестирую его в Firefox, я получаю синтаксическую ошибку)

Во-вторых, ваш HTML выглядит странно - есть ли причина, по которой вы закрываете открывающие теги привязки с помощью />, а не просто >?

Вау, мозг пердит. Не подумал проверить «удалить» как ключевое слово. Что-то вроде "да", когда это зарезервировано на многих других языках. :П

kafuchau 03.12.2008 00:47

XHTML использует /> для закрытия пустых тегов ... Это означает, что в коде исходного сообщения a-теги закрываются дважды !!

some 03.12.2008 01:54

Использование простой ссылки для такого действия, как удаление записи, кажется мне опасным: что, если сканер пытается проиндексировать ваши страницы? Он будет игнорировать любой javascript и переходить по каждой ссылке, что, вероятно, не очень хорошо.

Лучше использовать форму с method = "POST".

И тогда у вас будет мероприятие «OnSubmit», чтобы делать именно то, что вы хотите ...

Это отличный момент. Это не только потенциально опасно для вашего приложения, но и является нарушением спецификации HTTP.

Peter Bailey 03.12.2008 00:39

JW. Может ли сканер получить доступ к записям, не имея возможности войти в систему?

kafuchau 03.12.2008 00:43

Нет, сканеры не смогут получить доступ к защищенным частям вашего сайта.

Benry 03.12.2008 01:41

Если «защита» зависит от javascript, краулер (и любой, кто отключил javascript) может получить к нему доступ.

some 03.12.2008 01:50

@PeterBailey Какая часть спецификации HTTP касается этого? Можешь ссылку добавить что ли? Мне интересно прочитать об этом дальше.

A.R. 19.11.2013 18:41

У меня была проблема с IE7 и раньше я возвращал false.

Проверьте мой ответ здесь на другую проблему: Javascript не работает в IE

Ответ принят как подходящий

В вашем коде опечатка (тег а закрыт слишком рано). Вы можете использовать:

<a href = "whatever" onclick = "return confirm('are you sure?')"><img ...></a>

Обратите внимание на вернуть (подтвердить): значение, возвращаемое сценариями во встроенных событиях, определяет, запускается ли действие браузера по умолчанию или нет; если вам нужно запустить большой фрагмент кода, вы, конечно, можете вызвать другую функцию:

<script type = "text/javascript">
function confirm_delete() {
  return confirm('are you sure?');
}
</script>
...
<a href = "whatever" onclick = "return confirm_delete()"><img ...></a>

(обратите внимание, что удаление - это ключевое слово)

Для полноты: современные браузеры также поддерживают события DOM, позволяя вам зарегистрировать более одного обработчика для одного и того же события для каждого объекта, получить доступ к деталям события, остановить распространение и многое другое; см. События DOM.

onClick = "return confirm('Are you absolutely sure you want to delete?')"
Muhammad Fahad 26.02.2016 12:21

Ну, у меня была такая же проблема, и проблема была решена добавлением слова «возвращаться» перед подтверждением:

onclick = "return confirm('Delete entry?')"

Я бы хотел, чтобы это было полезно для вас ..

Удачи!

Ты уверен, что это работает? Он попросил меня подтвердить, но даже если выполняется действие Отменить выбранную ссылку ...

Gediminas 26.06.2019 18:21

У меня была такая же проблема (нажмите кнопку, но после нажатия кнопки отмены мой объект все равно удаляется), поэтому сделал это таким образом, надеюсь, что это поможет кому-то в будущем:

 $('.deleteObject').click(function () {
    var url = this.href;
    var confirmText = "Are you sure you want to delete this object?";
    if (confirm(confirmText)) {
        $.ajax({
            type:"POST",
            url:url,
            success:function () {
            // Here goes something...
            },
        });
    }
    return false;
});

Попробуй это:

OnClientClick='return (confirm("Are you sure you want to delete this comment?"));'
<img src = "images/delete.png" onclick = "return confirm_delete('Are you sure?')"> 



<script type = "text/javascript">
function confirm_delete(question) {

  if (confirm(question)){

     alert("Action to delete");

  }else{
    return false;  
  }

}
</script>

Если вы хотите использовать небольшие встроенные команды в теге onclick, вы можете использовать что-то вроде этого.

<button id = "" class = "delete" onclick = "javascript:if (confirm('Are you sure you want to delete this entry?')){jQuery(this).parent().remove(); return false;}" type = "button"> Delete </button>

Другие вопросы по теме