Ottenere jQuery mouseout evento al fuoco da tutti gli elementi figlio

Question

Ho una tabella all'interno di un Div, contenente 8 immagini, voglio sparare un evento mouseout sia per la tavola o la div, ma non scatta. Sto indovinando questo è perché il mouse è in realtà lasciando ciascuna delle immagini, oppure il TD, oppure il tr ecc ... c'è un modo per ottenere l'evento mouseout per l'intera tabella di propagare in modo che si è sparato ancora dagli elementi figlio? Il markup è dritto in avanti:

<div id=container>
  <table id="tbl">
    <tr>
      <td><img src=""></td>
      <td><img src=""></td>
      <td><img src=""></td>
      <td><img src=""></td>
    </tr>
    <tr>
      <td><img src=""></td>
      <td><img src=""></td>
      <td><img src=""></td>
      <td><img src=""></td>
    </tr>
  </table>
</div>

e il mio codice jQuery è:

$("#tbl").mouseout(function(){
  alert("out home");
});

Non posso licenziare i singoli eventi mouseOut per le immagini, perché a volte ci sono assolutamente elementi posti su di loro che fa sì che l'evento mouseout per essere licenziato prematuramente.

Answer 1

Dovrebbe essere:

$("#tbl").mouseout(function(){
  alert("out home");
});

Hai perso il "#". Se si desidera che solo le immagini, provare:

$("#tbl >img").mouseout(function(){
  alert("out home");
});

PS. Hai considerato di utilizzare $ ( "..."). Hover (), invece?

Answer 2

Non dovresti usare #tbl per selezionare la tabella?

$("#tbl").mouseout(function(){
  alert("out home");
});

Answer 3

evento Usa mouseleave, che ha esattamente la stessa funzionalità, ma non si accende con elementi figlio.

$("#tbl").bind("mouseleave",function(){
  alert("out home");
});