Форум

Spinne · #1 (**permalink**) 08.07.2011, 16:15

День добрый. Задали мне такую задачку:

Есть сайт, написанный на asp.net. Посетители сайта кликают на ссылки двух типов:
1. <a href="~/About.aspx"... ></a>
2. <span onclick="Index.ShowPopup();"... ></span>

Задача - для одной конкретной страницы перехватывать клики по ссылкам, подымать окошко "вы уверены? да/нет", если да, то выполнить действие (переход на страницу либо вызов функции), если нет то ничего не делать.

Сначала я попробовал перехватывать клик так:

window.captureEvents(Event.CLICK);
window.onclick= handle;

function handle(e) {
       alert("Объект window перехватывает это событие!");
       window.routeEvent(e);
       return true;
    }

Но в ИЕ такой подход не работает, а в мозилле и хроме сначала вызывается onclick, и после него handle.
Тогда я попробовал элементу <body> добавить onclick, но все равно onclick спана срабатывает перед onclick боди.
И вот вопрос, как тогда перехватывать клики?

melky · #2 (**permalink**) 08.07.2011, 16:41

тут все просто, но переход по спану ... это же не ссылка, ёмаё!

Пример: живой пример

<!DOCTYPE HTML>
<html>
<head><title>.</title><style>.a {color:blue;text-decoration: underline} a, span {margin:10px} </style></head>
<body>
     <a href="http://javascript.ru">Это ссыль внутри боди</a>
     <span onclick="location.href='http://google.ru'" class="a">спан внутри боди</span>

     <div>
     Это дивчик
     <a href="http://ya.ru">Это ссыль внутри дивчика</a>

         <span>
             А это спан внутри
             <a href="http://google.ru">Это ссыль внутри спана</a>
             <span onclick="location.href='http://google.ru'" class="a">спан глубоко внутри....</span>
         </span>

     <span onclick="location.href='http://google.ru'" class="a">спан внутри дива</span>
     </div>
<script>
document.body.onclick = function(e){
    if(!e){ e=event;e.target = e.srcElement }

    var tagname = e.target.nodeName.toLowerCase();

    if( tagname === "a" || tagname === "span") {
          alert( "Делаем чёрные дела. \n\nИмя тега : "+tagname );
          return false;
    } 

}
</script>
</body>
</html>

Spinne · #3 (**permalink**) 08.07.2011, 16:54

Таки работает, но! Я не зря написал

<span onclick="Index.ShowPopup();"... ></span>

То есть не переход

<span onclick="location.href='http://google.ru'"

а именно вызов функции. И при клике на такой спан сначала вызывается его функция, я уже потом document.body.onclick

А просто со ссылками да, все пучком

melky · #4 (**permalink**) 08.07.2011, 17:00

<span onclick="Index.ShowPopup();"... ></span>

в функции

Index.ShowPopup();

предусматривай отмену события, например

Index.ShowPopup({cancelable:true});

Форум

Справочник

Discord чат

Курсы javascript