JQuery: держать ссылку <a>кликабельной в интерактивном div

Question

Что я хочу сделать, это предотвратить клик на элементе div, если пользователь щелкнет ссылку внутри этого элемента div. но без использования .click (function () {}); по ссылке.

Вот код:

$('div.feature').click(function() { window.location = $(this).attr('rel');});

вот пример содержимого div:

<div id="feature" rel="urlnumberone">
some text
<a href="javascript:topicchange(this);" class="insideLink">Link</a>
</div>

И по какой-то конкретной причине Я не могу использовать что-то вроде этого

$('.insideLink').click(function(event){
    event.stopImmediatePropagation();
});

Я должен использовать эту функцию topicchange (), есть ли способ предотвратить распространение события?

Спасибо!

Answer 1

Пример, который вы предоставили, должен работать, за исключением того, что у вашего div есть идентификатор «feature», но в js вы нацеливаетесь на класс. jsfiddle.net / SNP3K .

<div id="feature" rel="urlnumberone">
    some text
    <a href="#" class="insideLink">Link</a>
</div>

.

$('div#feature').click(function() { 
    alert('div');
});

$('.insideLink').click(function(event){
    event.stopImmediatePropagation();
    alert('link')
});

Answer 2

<div id="feature" onclick="location.href='index.php';">
   <a href="anotherpage.php">link</a>
</div>

Легко как то!

Answer 3

Согласно http://api.jquery.com/bind/, event.stopPropagation должен разрешать выполнение других обработчиков событий на цели.Вы все еще можете выполнить с Href, но вы также можете обрабатывать всплывающее окно клика по умолчанию в div, игнорируя его.

Полная демонстрация в: http://jsfiddle.net/leomwa/qrFQM/

Фрагмент:

function topicChange()
{
    alert('Message from Link: After the div mouse event, I can execute');
    return false;
}

$('div#feature').click(function(evnt)
{
    var $originatingTarget = $(evnt.target);
    if ($originatingTarget && $originatingTarget.is('.insideLink'))
    {
        alert('Message from Div: Ahh! You clicked on Link...');
        evnt.stopPropagation(); // Allows other handlers on the event.target to be executed.
    }
});

Очень похоже на @ shanethehat.

Престижность @shanethehat за просьбу дать разъяснения.

Answer 4

$(document).ready(function() {
    $('div#feature').click(function() {
        alert('div');
    });
    $('div#feature a').click(function(evt) {
        evt.stopPropagation();
    });
});

function topicchange(targ) {
    alert('link');
    return false;
}

Это разрешено? Функция изменения темы вызывается непосредственно из href, но предотвращается распространение события click. Или же все происходит в теме обмена?