Jquery отключить двойной щелчок при наведении на селектор

Question

У меня есть функция, когда пользователь дважды щелкает горизонтальный список, этот элемент перемещается в другой div. Одним из тегов li в этом неупорядоченном списке является поле ввода текста. Я хотел бы отключить поведение двойного щелчка только на этом конкретном поле. Поскольку поле ввода является частью элемента ul, я не могу найти способ предотвратить запуск события двойного щелчка при двойном щелчке по этому текстовому полю. Вот что у меня есть. Я принимаю ответы в coffeescript или обычном javascript благодаря js2coffee.org:)

Следующий код перемещает горизонтальный элемент ul в другой div и обратно к оригиналу, если дважды щелкнуть дважды. Работает отлично. Как я могу временно отключить его при наведении на поле ввода.

$(".available_product_shipments").on "dblclick", ".product", ->
  $(this).appendTo ".product_shipments"
$(".product_shipments").on "dblclick", ".product", ->
  $(this).appendTo ".available_product_shipments"

И эквивалент JS:

$(".available_product_shipments").on("dblclick", ".product", function() {
  $(this).appendTo(".product_shipments");
});

$(".product_shipments").on("dblclick", ".product", function() {
  $(this).appendTo(".available_product_shipments");
});

HTML структурирован так

<ul>
  <li class="product">
    <ul>
      <li class="avail_qty_field"><input type="text /></li> #Prevent dblclick here
      <li>...</li>
      <li>...</li>
    </ul>
  </li>
  <li class="product">
    <ul>
      <li class="avail_qty_field"><input type="text /></li> #Prevent dblclick here
      <li>...</li>
      <li>...</li>
    </ul>
  </li>
</ul>

Answer 1

Я не знаю, как это сделать в сценарии кофе, но вам просто нужно сделать

if ($(event.target).is("input")) return; 

или что-то подобное.

Это версия без c о-сценария:

$(".available_product_shipments").on("dblclick", ".product", function(e) {
  if ($(e.target).is("input")) return;
  $(this).appendTo(".product_shipments");
});

$(".product_shipments").on("dblclick", ".product", function(e) {
  if ($(e.target).is("input")) return;
  $(this).appendTo(".available_product_shipments");
});

И вот как это выглядит в coffee script

$(".available_product_shipments").on "dblclick", ".product", (e) ->
  return  if $(e.target).is("input")
  $(this).appendTo ".product_shipments"

$(".product_shipments").on "dblclick", ".product", (e) ->
  return  if $(e.target).is("input")
  $(this).appendTo ".available_product_shipments"

Answer 2

Попробуй это

$(".available_product_shipments").on("dblclick", ".product", function(e) {
  if( $(e.target.localName === 'input')) return;
  $(this).appendTo(".product_shipments");
});

$(".product_shipments").on("dblclick", ".product", function(e) {
  if( $(e.target.localName === 'input')) return;
  $(this).appendTo(".available_product_shipments");
});

редактировать: исправленный синтаксис

Answer 3

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

HTML

<div class="collection">
    <input class="product" type="text" />
    <input class="product" type="password" />
</div>

Кофе

$(".collection").on "dblclick", ".product:not('input[type=text]')", ->
  alert "double clicked"

JsFiddle Посмотрите это в действии здесь: http://jsfiddle.net/anAgent/wQsss/