Событие jQuery, запускаемое при нажатии вне списка

Question

Событие jQuery, запускаемое при нажатии вне списка

0

Я пытаюсь вызвать событие click для каждого элемента во вложенном списке и возвращать текст щелкнутого элемента. Часть возвращаемого текста работает нормально, но когда я выхожу за пределы списка, он по-прежнему запускает событие клика и возвращает текст элемента списка в соответствующей строке. Кто-нибудь сталкивался с такой проблемой?

HTML:

 <div id="myDiv">
    <ul id = "u" class="nam">
      <li id="i1" class="nam">John</li>
      <li id="i2" class="nam">
          <ul id="uu">
             <li id="i3">F</li>
             <li id="i4">Fitzgerald</li>
          </ul>    
      </li>
      <li id="i5" class="nam">Kennedy</li>
     </ul>
   </div>

Код jQuery:

  $("#u").on("click","li",function(event){
   event.stopPropagation();
   alert($(this).text());
});

Mannythoughts 03 май 2014, в 09:57

Источник

0

у тебя есть css?
jycr753 03 май 2014, в 07:22
0

<ul id = "u" class="nam"> вероятно, не должно быть пробела вокруг =
Mifeng 03 май 2014, в 07:24

Теги:

jquery

3 ответа

1

Предоставление фиксированной ширины позволит решить эту проблему, но другое решение - обертывание содержимого li с помощью span. Вы можете сделать это с помощью jquery, если вы не хотите делать это в своем html-коде, а затем создайте событие click для селектора li span.

$("li").not(":has(ul li)").wrapInner("<span></span>");

$("#u").on("click","li span",function(event){
  event.stopPropagation();
  alert($(this).text());
});

FIDDLE

Ryan.Hunt 03 май 2014, в 05:12

0

Спасибо, это сработало.
Mannythoughts 05 май 2014, в 08:17

0

Просто создайте свой div ul li, и ваша проблема будет решена, потому что элемент, который вы используете, является блочным элементом, который использует полную страницу, поэтому создайте свою страницу или создайте фиксированный пиксель, который будет работать.

Sikander 03 май 2014, в 05:08

Ещё вопросы

<ul id = "u" class="nam"> вероятно, не должно быть пробела вокруг =

Mathlight · Accepted Answer · 2014-05-03T04-59-00.000Z

Проблема в том, что без какого-либо ширинного стиля ваш div и UL берут всю ширину страницы.

Здесь вы можете увидеть этот пример: JSFIDDLE

Если вы дадите div с некоторыми, проблема исчезнет (контейнер будет нажимать будет меньше)

width: 200px;