Come si attiva un evento di sfocatura/messa a fuoco su una casella di testo di input usando jquery?

Question

Sto utilizzando 1.7.2 in cui ho capito questo dovrebbe funzionare:

// cell is a jquery representation of a <td> element 
cell.append($("<input/>", { "type": "text" }).val(content));   
cell.children()[0].focus(); 
cell.children()[0].on("blur", function() { 
    alert("blur"); 
} 

La casella di input viene aggiunto, afferra fuoco, quindi la console JavaScript mi ​​dice:

Uncaught TypeError: Object #<HTMLInputElement> has no method 'on' 

mi piacerebbe essere grato se qualcuno sa come posso prendere l'evento sfocatura/messa a fuoco.

Answer 1

Si accede all'elemento DOM con [0] e di agire come se fosse è aj Oggetto di query

Se si desidera solo il primo, è necessario utilizzare eq() per ottenere l'oggetto jQuery.

cell.children().eq(0).focus().on("blur", function() { 
    alert("blur"); 
}; 

Answer 2

È necessario associare l'evento delegato ie. eventi dal vivo a tali input, poiché sono stati aggiunti al DOM in un secondo momento, quindi hanno bisogno di un gestore eventi live.

$(cell).on('blur focusout', ':text', function() { 
    alert(this.value); 
}); 

quindi attivare come segue:

$(':input:first', cell).blur(); // or $(':text', cell).trigger('blur'); 

$(':input:first', cell).focusout(); // or $(':text', cell).trigger('focusout');. 

in base al codice

cell.children(':input:eq(0)').focus().on("blur", function() { 
    alert("blur"); 
}; 

o

cell.children(':input:first').focus().on("blur", function() { 
    alert("blur"); 
}; 

Answer 3

Si sta chiamando .on su un elemento DOM, non oggetto jQuery, provate questo:

var input = $("<input/>", { "type": "text", val: content }); 
cell.append(input); 
input.focus(); 
input.on("blur", function(){ 
    alert("blur"); 
});