如何在<tr>

Question

檢測的關鍵事件我有這種格式的列表：

<tr class='hoverTr trBuscaFornecedor'> 
    <td width='100px'>Information 0</td> 
    <td>Information 1</td> 
    <td><input type='radio' class='hidden_apoioSelect'/></td> 
</tr> 

而且JS：

$(".hidden_apoioSelect").live("focusin", function(){ 
    $(this).keydown(function(e) { 
     if((e.keyCode == 13 || e.keyCode == 40)){ 
      $(this).closest("tr").next().find('input').focus(); 
      $(this).closest("tr").removeClass("activeTr"); 
      $(this).closest("tr").next().addClass("activeTr"); 

     }else if(e.keyCode == 38){ 
      $(this).closest("tr").prev().find('input').focus(); 
      $(this).closest("tr").removeClass("activeTr"); 
      $(this).closest("tr").prev().addClass("activeTr"); 
     } 
    }); 
}); 

那麼，這會給用戶的使用機會，他們的鍵盤來選擇數據庫結果列表中的項目。

正如你所看到的，我被迫把radio使focus遵循線，所以我的問題是：

我怎麼能做到這一點，而不radio，僅使用<tr>？

p.s.我會接受任何提示來改進我的代碼。

謝謝！

Answer 1

這是你在追求什麼？

$("tr").live("keydown", function(e){ 

    if ((e.keyCode == 13 || e.keyCode == 40)) { 
     $(this).closest("tr").next().find('input').focus(); 
     $(this).closest("tr").removeClass("activeTr"); 
     $(this).closest("tr").next().addClass("activeTr"); 

    } else if (e.keyCode == 38) { 
     $(this).closest("tr").prev().find('input').focus(); 
     $(this).closest("tr").removeClass("activeTr"); 
     $(this).closest("tr").prev().addClass("activeTr"); 
    } 
}); 

jsFiddle Demo

或者在更短的也可以做到這一點，我認爲這是你希望同樣的事情！

$("tr").live("keydown", function(e){ 
    if ((e.keyCode == 13 || e.keyCode == 40 || e.keyCode == 38)) { 
     $(this).closest("table").find('tr').not(this).removeClass("activeTr"); 
     $(this).addClass("activeTr"); 
    } 
}); 

jsFiddle Demo #2