Подтверждение действий пользователя
11:08 21 Апр. 2008 Автор: Z-DenБывают такие моменты, когда при нажатии на ссылку или кнопку, у пользователя необходимо запросить подтверждение на нажатие на эту ссылку или кнопку в форме. Особенно часто это происходит при создании различных админок, особенно при удалении чего-либо. В таких случаях нам на помощь приходит вездесущий Java-script. И сложного тут ничего нет.
Подтверждение кликов по ссылке.
Итак, у нас есть ссылка. При нажатии на нее должно выскочить окошко с надписью «Уверенны?», и двумя кнопочками «ОК» и «Отмена». При нажатии на «ОK» мы переходим по ссылке. «Отмена» — остаемся на исходной странице. Если у пользователя Java-script отключен, то ссылка будет работать как обычная, т.е. никаких окошек выскакивать не будет и при нажатии мы сразу переходим по ссылке.
Код:
<script type="text/javascript">function clicker(lnk){if(confirm("Уверенны?")) window.location.href=lnk.href;return false;}</script><a href="http://godcow.org/" onclick="return clicker(this);">На главную</a>
Вот как это выгладит в браузере:
Теперь, при клике по ссыке срабатывает событие onclick, которое выполняет java-script, которые написан в его атрибуте (onclick="return clicker(this);"). Этот java-script возвращает результат работы функции clicker(lnk), а вернет она, в любом случае, false. Сделано это для того, чтобы при нажатии на ссылку пользователь не переходил на адрес, указанный в атрибуте href. Если у пользователя отключен java-script, то возвращаться ничего не будет, и он спокойно сможет перейти по этой ссылке. В коде самой функции, мы выдаем пользователю диалоговое окно с двумя кнопками «ОК» и «Отмена» и надписью «Уверенны?» (confirm("Уверенны?")). Тепер, при нажатии на «ОК», произойдет редирект на страницу укзанную в атрибуте href, нашей ссылки. А при нажатии на«Отмена», функция просто вернет значение false.
Подтверждение кликов по кнопке в форме
С кнопками в формах дело обстоит, практически так-же как и с ссылками. За исключением того, что вместо редиректа в третей строке, мы отправим данные формы на требуемый адрес как, будто пользователь нажал на кнопку Submit. Еще функции submiter(frm) мы передаем имя (name) формы, данные которой нужно отправить на сервер.
<script type="text/javascript">function submiter(frm){if(confirm("Уверенны?")) document.forms[frm].submit();return false;}</script><form method="get" name="form" action="http://godcow.org/"><div><input type="text" value="" name="s" /><input type="submit" value="Найти" onclick="return submiter(’form’);" /></div></form>
Теперь можете проверить этот скрипт в действии:
Вот, собственно и все.