Mam funkcję, gdy użytkownik dwukrotnie kliknie poziomą listę, element ten jest przeniesiony do innego div. Jeden z tagów Li na tej liście nieuporządkowanej jest pole wprowadzania tekstu. Chciałbym wyłączyć zachowanie dwukrotne tylko na tym konkretnym polu. Ponieważ pole wejściowe jest częścią elementu UL, nie mogę znaleźć sposobu, aby zapobiec wystrzelić zdarzenie podwójnego kliknięcia, gdy to pole tekstowe jest dwukrotnie kliknięte. Oto, co mam. Akceptuję odpowiedzi w CoffeScript lub regularny JavaScript dzięki JS2Coffee.org :)

Poniższy kod przenosi poziomy element UL do innego div iz powrotem do oryginału, jeśli dwukrotnie kliknął dwukrotnie. Działa świetnie. Jak mogę tymczasowo wyłączyć podczas unoszenia się w polu wejściowym.

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

I odpowiednik JS:

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

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

HTML jest w takim stanie

<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>
1
ctilley79 3 październik 2012, 22:27

3 odpowiedzi

Najlepsza odpowiedź

Nie wiem, jak to zrobić w skrypcie kawy, ale wystarczy to zrobić

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

Lub coś podobnego.

Jest to wersja bez kawiarni:

$(".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");
});

I tak wygląda w CoffeScript

$(".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"
2
ctilley79 3 październik 2012, 19:01

Spróbuj tego

$(".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");
});

Edytuj: Poprawiona składnia

2
ctilley79 3 październik 2012, 19:09

Zamiast filtrować zdarzenie po tym, jak się stanie, filtrowałem go za pomocą "nie selektor" filtr. Z poniższego przykładu nie podłączy się zdarzenia na typ wejścia "tekst", ale jestem na typowym "Hasła".

HTML

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

kawa

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

jsfiddle Zobacz to w akcji tutaj: http://jsfiddle.net/anagent/WQSSS/

0
anAgent 3 październik 2012, 18:42