JQuery отбрасывает события клика - PullRequest
Новая
       11

JQuery отбрасывает события клика

2 голосов
/ 01 ноября 2011

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

Код прост: 

<ul class="iconButtons ui-widget ui-helper-clearfix">
  <li class="ui-state-default ui-corner-all" title="Save">
    <span class="btnSave ui-icon ui-icon-disk"></span>
  </li>
</ul>

$(document).ready(function() {
    $(".btnSave").click(function() {
       alert("Sometimes I never get called!");
    });
});

Часто встречается во всех браузерах.Использование live демонстрирует то же поведение.

Ответы [ 6 ]

2 голосов
/ 01 ноября 2011

Я бы посоветовал вам использовать якорь вместо промежутка для кнопки, она будет срабатывать наверняка.Поместите 

$(".btnSave").click(function(event){
  event.preventDefault();
  alert("Clicked");
});

В IE вам также нужно иметь контент внутри якоря, чтобы он работал: фоновое изображение / цвет фона / текст (возможно, также с большим отрицательным отступом)

2 голосов
/ 01 ноября 2011

Я бы рискнул сказать, что есть некоторые другие осложнения, которые могут помешать вам.

Вот несколько возможностей:

  1. Если вы не укажете этот пустой интервал display:block;, то в некоторых браузерах он будет иметь ширину и высоту 0px и будет недоступен для клика. Имейте в виду, что просто добавление ширины и высоты к диапазону не будет работать на inline элементах.

  2. Вы управляете содержимым ajax, а не привязываете обработчик кликов. Вы можете проверить в любое время, выполнив $(".btnSave").data("events") в консоли Firebug или Chrome, чтобы увидеть количество событий для этого элемента.

  3. Другое событие узурпирует ваше событие, и использование техники из # 2 может помочь выявить это.

  4. Ваш дескриптор клика вызывается , но не возвращает правильный результат, заставляя поверить, что он не был вызван. Вы пытались добавить alert('called') в самый верх обработчика кликов?

  5. Вы уверены, что элемент существует в DOM до добавления к нему элемента click? Вы можете проверить, выполнив alert($(".btnSave").length) в строке JUST перед привязкой обработчика щелчков.

1 голос
/ 01 ноября 2011

Ваш код подключит обработчики событий ко всем элементам с таким классом , которые уже существуют, когда код называется . Если вы добавите больше позже, они не получат обработчик, потому что, ну, вы не спросили, что они делают. :-) Опции:

  • Вместо этого вы можете использовать live, если вы добавляете и удаляете эти элементы динамически. live (и связанные delegate) используют делегирование события для отслеживания событий, а не для прикрепления обработчиков к рассматриваемым элементам. live использует сам document. Так как click пузыри, document видит все клики (которые не отменены), и поэтому обработчик jQuery для всего документа может видеть, был ли клик на элементе .btnSave, и запускать ваш обработчик, если так.
  • Вы можете поместить свой скрипт внизу страницы (непосредственно перед закрывающим элементом </body>), чтобы все элементы были там, когда вы подключаете свой обработчик.
  • Вы можете использовать функцию jQuery ready, чтобы DOM был готов, прежде чем подключать обработчики.

С другой стороны, как указано, ваш span чертовски труден для щелчка (что из-за того, что он полностью пустой), если только не существует CSS, дающего размеры, которые вы не показали ...; -)

Обновление : Вы сказали, что у пролета есть измерения, и что обработчик подключен нормально (вы не сказали как вы это знаете). Остается только то, что что-то подключает событие click к этим элементам и отменяет их (например, через stopImmediatePropagation, , как это ), и случается, что они ' ранее в списке обработчиков событий, чем ваш обработчик. Впрочем, более вероятно, что есть проблема с подключением.

0 голосов
/ 23 июля 2013

Я использую jquery-ui-1.10.3, и у меня та же проблема с кнопками .toggle - они просто не очень отзывчивы. Я думаю, что это присуще jquery-ui, потому что даже на их демонстрационной странице кнопка переключения выглядит менее чем удивительно с точки зрения тактильной реакции. Если я нажимаю очень медленно и осознанно, я могу обычно получить кнопку для включения и выключения, но быстрое нажатие очень ударяет или пропускает. Я перепробовал все советы по ускорению jquery-ui, но ни один из них не сработал.

0 голосов
/ 01 ноября 2011

Оказывается, интервал, к которому добавлялось событие нажатия, занимал только центральную часть графического изображения кнопки.Нажатие непосредственно на глиф всегда вызывало событие, но небольшое нажатие снаружи (хотя, по-видимому, все еще внутри кнопки) не вызвало бы событие.

Я надеюсь, что это поможет любому другому использовать кнопки mini JQuery таким же образом, как онипредставлен на странице JQuery UI ThemeRoller .

0 голосов
/ 01 ноября 2011

Для этого может быть много разных причин, например ::100100

  • код JS, на который вы ссылаетесь, не выполняется правильно (не связывает событие в нужный момент времени), попробуйте выполнить его, когда DOM будет готов: 

    jQuery(function(){
    // your code goes here
});

  • возможно, вы динамически создаете этот элемент (если сначала связать его, а затем создать элемент, этот элемент не будет иметь определенного события). Решение состоит в том, чтобы использовать функции .delegate() или .live() jQuery.

  • событие может быть не привязано где-то в вашем коде. Попробуйте найти использование .unbind() функции jQuery в коде JS (или даже HTML).

...