Форум

liverpoodlian · #1 (**permalink**) 13.04.2015, 09:42

Подскажите, пожалуйста, решение проблемы.
Суть такова: есть "выезжающая" панель, которая отображается по событию onclick на div'e.
Вся проблема в том, что на этом div'e, к которому привязано событие onclick, есть ссылка, и она не работает.
Точнее при клике на ней левой кнопкой срабатывает onclick div'a, а саму ссылку можно задействовать колесиком или правой кнопкой мыши.

Код, отвечающий за панель:

$(".itemNameBlock").live("click", function () {
        $(this).next(".reviewInfoBlock").slideToggle("slow");
        return false;
    });

И такой div:

<div class="myReview">
    <div class="itemNameBlock">
        <p>
            Отзыв о товаре <a href="/Goods/GoodWatch/@Model.id" class="itemName" >@Model.itemName</a>
            <span class="reviewDate">@Model.date.ToString("dd.MM.yyyy, H:mm")</span>
        </p>
    </div>
    <div class="reviewInfoBlock">
        <p><span class="advantage">Достоинства:</span> @Model.advantages</p>
        <p><span class="disadvantage">Недостатки: </span>@Model.disadvantages</p>
        <p>Комментарий: @Model.comment</p>
        <p>Оценка: @Model.rate</p>
    </div>
</div>

ksa · #2 (**permalink**) 13.04.2015, 10:03

Сообщение от liverpoodlian

при клике на ней левой кнопкой срабатывает onclick div'a

http://javascript.ru/tutorial/events...ovka-vsplytiya

рони · #3 (**permalink**) 13.04.2015, 10:12

liverpoodlian,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
 .myReview .reviewInfoBlock{
   display: none;
 }
  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
     $(function(){
       var s = $(".myReview");
       s.on('click','.itemNameBlock',function(event) {
if($(event.target).is('a')) return;
$(this).next(".reviewInfoBlock").slideToggle("slow");
        return false;
      });
});


  </script>
</head>

<body>  <div class="myReview">
    <div class="itemNameBlock">
        <p>
            Отзыв о товаре <a href="http://javascript.ru/forum/" class="itemName" >@Model.itemName</a>
            <span class="reviewDate">@Model.date.ToString("dd.MM.yyyy, H:mm")</span>
        </p>
    </div>
    <div class="reviewInfoBlock">
        <p><span class="advantage">Достоинства:</span> @Model.advantages</p>
        <p><span class="disadvantage">Недостатки: </span>@Model.disadvantages</p>
        <p>Комментарий: @Model.comment</p>
        <p>Оценка: @Model.rate</p>
    </div>
</div>

</body>

</html>

Форум

Справочник

Discord чат

Курсы javascript