Zmiana pierwszeństwa wydarzenie z JQuery

Question

Mam następujący kod HTML:

<input type="text" id="theInput" value=""/>  
<a href="#" id="theLink">Click me</a> 

Chcę wykryć, gdy zmienia wejściowych i wykonać operację w tym przypadku, ale tylko wtedy, gdy użytkownik nie kliknął w link. Próbowałem to:

$('#theLink').live('click', function(){ 
    alert('click'); 
}); 

$('#theInput').live('change', function(){ 
    alert('change'); 
}); 

Jednak change jest zawsze wykonywane przed click gdy wartość na wejściu zmianie, ze względu na Javascript zasad pierwszeństwa wydarzenie, a więc pojawia się tylko komunikat „zmiana”.

Chciałbym, aby wyświetlał change tylko wtedy, gdy wartość wejściowa uległa zmianie i użytkownik opuścił wejście klikając w dowolnym innym miejscu zamiast łącza. W tym ostatnim przypadku chciałbym wyświetlić click.

Przykład to here.

Używam jQuery 1.6.4.

Answer 1

O ile mi wiadomo, pożary click zdarzeń po blur i change wydarzeń w każdej przeglądarce (spojrzeć na this JSFiddle). Kolejność numerów blur i change jest różna w różnych przeglądarkach (źródło: Nicholas Zakas).

Aby rozwiązać problem, można posłuchać zdarzeń click w dokumencie i porównać cel zdarzenia z #theLink. Każde zdarzenie kliknięcia będzie dymić do dokumentu (chyba że jest to zabronione).

Spróbuj tego:

var lastValue = ''; 

$(document).click(function(event) { 
    var newValue = $('#theInput').val(); 

    if ($(event.target).is('#theLink')) { 
     // The link was clicked 
    } else if (newValue !== lastValue) { 
     // Something else was clicked & input has changed 
    } else { 
     // Something else was clicked but input didn't change 
    } 

    lastValue = newValue; 
}); 

JSFiddle: http://jsfiddle.net/PPvG/TTwEG/

Answer 2

Ok, teraz mam go, można zrobić

$('#theLink').live('click', function(e){ 
    alert('click'); 
}); 

$('#theInput').live('change', function(e){ 
    //Check if the change events is triggerede by the link 
    if(e.originalEvent.explicitOriginalTarget.data === "Click me"){ 
     //if this is the case trigger the click event of the link 
     $('#theLink').trigger("click"); 
    }else{ 
     //otherwise do what you would do in the change handler 
     alert('change'); 
    } 
}); 

Fiddle tutaj http://jsfiddle.net/hTqNr/19/

Answer 3

dlaczego nie wybrać wartość pola. trzeba przechowywać wartość początkową polu tekstowym na gotowej funkcji

initialvalue= $('#theInput').val(); 

następnie porównać wartość

$('#theLink').live('click', function(){ 
    var newvalue =$('#theInput').val(); 
     if(newvalue!=initialvalue) { 
      //do something 
     } 

    }); 

Answer 4

Oba wydarzenia będą pożarowych, ale w swojej przykład wpisu w module obsługi onchange zdarzeń opalane gdy zdarzenie onmousedown wystąpi zatrzyma zdarzenie onmouseup wymagane do wystrzelenia zdarzenia onclick. Użycie numeru console.log spowoduje wyświetlenie obu zdarzeń.

http://jsfiddle.net/hTqNr/4/