Cambiare la precedenza evento con JQuery

Question

Ho il seguente codice html:

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

voglio rilevare quando l'ingresso cambia ed eseguire un'operazione in questo caso, ma solo quando l'utente non ha fatto clic nel link. Ho provato questo:

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

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

Tuttavia change viene sempre eseguito prima click quando il valore in ingresso è cambiato, a causa delle regole di precedenza evento Javascript, e, pertanto, viene visualizzato solo il messaggio "cambiamento".

Mi piacerebbe che venga visualizzato change solo se il valore di input è cambiato e l'utente è uscito dall'ingresso facendo clic in qualsiasi altro posto anziché sul collegamento. In quest'ultimo caso mi piacerebbe visualizzare click.

L'esempio è here.

Io uso jQuery 1.6.4.

Answer 1

Per quanto ne so, le click generato l'evento dopo le blur e change eventi in tutti i browser (dare un'occhiata al this JSFiddle). L'ordine di blur e change è diverso tra i vari browser (fonte: Nicholas Zakas).

Per risolvere il problema, è possibile ascoltare gli eventi click sul documento e confrontare il target dell'evento con . Qualsiasi evento click diventerà un bollo sul documento (a meno che non venga prevenuto).

Prova questo:

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, ora ho capito, si potrebbe fare

$('#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 qui http://jsfiddle.net/hTqNr/19/

Answer 3

perché voi non scegliere il valore della casella di input. è necessario memorizzare il valore iniziale della casella di immissione sulla funzione pronta

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

quindi confrontare il valore

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

    }); 

Answer 4

Entrambi gli eventi saranno il fuoco, ma nel tuo esempio l'avviso nel gestore onchange eventi licenziato quando l'evento onmousedown si verifica per interrompere l'evento onmouseup richiesto per l'evento onclick. L'utilizzo di console.log mostrerà l'attivazione di entrambi gli eventi.

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