JQuery. Нажмите на якорь, когда я не хочу! - PullRequest
0 голосов
/ 15 октября 2010

У меня есть набор вложенных DIV, которые переключаются с помощью jQuery, когда пользователь нажимает на них.Внутри самого внутреннего DIV есть тег привязки с HREF, который должен где-то перемещаться.Проблема в том, что когда я нажимаю на ссылку, она перемещается так же, как родительские DIV, вместо перехода по URL.Если я щелкну правой кнопкой мыши на якорь и выберу открыть в новой вкладке, то это хорошо перемещается.Пожалуйста, вы можете определить, что идет не так?Спасибо

  <div class="pod"> 
    <li id='ThirdParty'> 
        <div class='block'> 
            <h1>ThirdParty</h1>
            <div class='systemHeader'> 
                <h2><span>Bobs shop</span></h2> 
                <div class='subSystems'>                     
                    <div class='subSystemHeader'> 
                        <h3><span>&nbsp;Gifts</span></h3> 
                        <div class='reports '> 
                            <p class='reports i1'> 
                                <a href='/Next.Whs.Web.MenuSystem/Default.aspx?id=470' title=''>Option 1</a></p> 
                        </div> 
                    </div> 
                </div> 
            </div> 
        </div> 
    </li> 
</div>

    $("div.subSystemHeader, div.subSystemHeader").click(function() { 
   $("> div", this).slideToggle(...); 
   return false; 
}); 

Ответы [ 4 ]

2 голосов
/ 15 октября 2010

Несколько изменений здесь, нет необходимости повторять тот же селектор и проверять, что событие не пришло из тега <a>, например:

$("div.subSystemHeader").click(function(e) { 
  if(e.target.nodeName == 'A') return; //skip this handler, don't return false
  $("> div", this).slideToggle(...); 
  return false; 
});

Вы можете проверить это здесь . Если цель события была от <a> (его потомков нет), то мы просто выходили из обработчика, возвращая undefined, так как мы не возвращаем явно false, событие click сделает это нормально ... едем в href.

2 голосов
/ 15 октября 2010

вы можете проверить объект события клика, а затем проверить цель события - см. Также http://api.jquery.com/event.target/

 $("div.subSystemHeader, div.subSystemHeader").click(function(event) { 
   if(event.target.nodeName.toLowerCase() == 'a') return;
 ...
 }

(не проверял, но он должен работать)

0 голосов
/ 14 октября 2011

Я только что столкнулся с этим вопросом сегодня. Я нашел очень интересную статью, которая может помочь. В нем описывается неправильное (использование) возвращаемых значений false и событий Jquery (http://fuelyourcoding.com/jquery-events-stop-misusing-return-false/).. Я не проверял следующий код на вашем примере, но думаю, что это должно работать.

$('.subSystemHeader a').click(function(e){
    e.stopPropagation(); 
});
0 голосов
/ 15 октября 2010

Ваша проблема return false;, которая блокирует поведение по умолчанию.

$("a:eq(0)").click(function() {
    return false; /* does nothing */
});
$("a:eq(1)").click(function() {
    /* go to href */
});
...