Диалоговое окно подтверждения Javascript

Я хочу добавить диалог подтверждения к кнопке удаления, чтобы спросить пользователя, хорошо ли это или не удалять выбранный элемент.

Если нет, ничего не должно произойти, иначе должен быть выполнен URL-адрес.

Я знаю, как реализовать это с помощью кода javascript, но я ищу решение, в котором меньше кода. Я имею в виду, например,

<a href="mysite.de/xy/delete" onClick="...">Delete</a>

Можно ли поместить всю функциональность в элемент onClick без добавления в заголовок некоторого дополнительного javascript?

Ответ 1

Лучше (хотя далек от идеала!): разверните его. Не позволяйте ссылке ничего делать, если вы не получили JavaScript:

<a href="#" 
  onclick="if confirm('Sure?') { window.location='http://mysite.de/xy/delete';}">
    Click to delete
</a>

Это, по крайней мере, предотвращает работу ссылки без JavaScript. Это также снижает риск того, что ссылка случайно будет сканирована Google или даже некоторым локальным плагином. (Изображение, если у вас есть плагин, который будет пытаться загрузить/показать как миниатюру) целевую страницу при наведении ссылки!)

Тем не менее, это решение не является идеальным. Из-за этого вы на самом деле просматриваете URL-адрес, и URL-адрес может появиться в истории. Вы действительно можете удалить Боба, создать нового Боба, а затем удалить его случайно, просто нажав "назад" в браузере!

Лучшим вариантом будет использование JavaScript или формы для публикации желаемого действия. Вы можете сделать запрос на сервер с помощью метода POST или, возможно, лучшего метода DELETE. Это также должно помешать индексированию URL.

Ответ 2

Вы можете return confirm() (который возвращает true/false), например:

<a href="mysite.de/xy/delete" onClick="return confirm('You sure??');">Delete</a>

Вы можете протестировать его здесь

Ответ 3

Подумайте, что произойдет, если у пользователя отключен javascript, или если google приходит и пауки ссылку. Будет ли удалена ваша сущность?

Лучше всего отправить опубликованную форму.

Ответ 4

Существует плагин jQuery, который делает именно это: jquery.confirm.

Пример:

<a href="home" class="confirm">Go to home</a>

Код JS:

$('.confirm').confirm();

Если пользователь подтверждает, он перенаправляется на ссылку <a>, иначе ничего не происходит.