無法在包含div的選項卡中鍵入textarea內部？

Question

無法在包含div的標籤（id =「center」）之後鍵入textarea內部？

這裏是代碼...

<div id="north">North</div> 
<div id="west">West</div> 
<div id="center"><textarea></textarea></div> 

腳本

$(document).ready(function() { 
    var divs = ["north", "west", "center"]; 
    var startIndex = 0; 
    $(document).keydown(function(e) { 
     if (e.which == 9) { 
      $("div").css("border", ""); 
      $("#" + divs[startIndex]).css("border", "4px solid gray"); 
      startIndex++; 
      if (startIndex === divs.length) { 
       startIndex = 0; 
      } 
     } 
     return false; 
    }); 
});​ 

Answer 1

要返回上不斷的keydown假的 - 這是防止你從你的文字區域內鍵入

$(document).keydown(function(e) { 
    if (e.which == 9) { 
     $("div").css("border", ""); 
     $("#" + divs[startIndex]).css("border", "4px solid gray"); 
     startIndex++; 
     if (startIndex === divs.length) { 
      startIndex = 0; 
     } 
    } 
    return false; // <-- 
}); 

如果您想防止默認選項卡行爲，則應將其移動到if (e.which == 9)狀態中換貨

$(document).keydown(function(e) { 
    if (e.which == 9) { 
     $("div").css("border", ""); 
     $("#" + divs[startIndex]).css("border", "4px solid gray"); 
     startIndex++; 
     if (startIndex === divs.length) { 
      startIndex = 0; 
     } 
     return false; // <-- Move it here to prevent tab default behavior 
    }   
}); 

或者你可以直接刪除它，如果你並不需要防止的keydown

Answer 2

任何默認行爲可以使用.preventDefault()方法阻止默認事件。

$(document).ready(function() { 
    var divs = ["north", "west", "center"]; 
    var startIndex = 0; 
    $(document).keydown(function(e) { 
     if (e.which == 9) { 
      e.preventDefault() 
      $("div").css("border", ""); 
      $("#" + divs[startIndex]).css("border", "4px solid gray"); 
      startIndex++; 
      if (startIndex === divs.length) { 
       startIndex = 0; 
      } 
     } 

    }); 
});