Question

我不是最有经验的jquery所以我来到这里希望得到答案。我遇到的问题是如何在点击键盘按钮时隐藏网页上的所有div。

我知道隐藏和显示div的基本代码是：

$(document).ready(function() {
    $("div").hide();  
    $("div").show();
});

我不知道的是，是否有更简单的方法来隐藏网页上的每个div，而不是只有一百个$("div").hide();语句。我也不确定如何监视键盘上的点击，然后隐藏并显示各种div。

谢谢！

Answer 1

最简单的方法是，您需要收听keypress事件（或keyup或keydown事件），如果使用特定密钥响应该事件：< / p>

$(document).keypress(function(e){
    var key = e.which;
    if (key == 116) {
        // if the user pressed 't' (for 'toggle'):
        $('div').toggle();
    }
});

Simple JS Fiddle demo

参考文献：

keypress()。
toggle()。

Answer 2

$(document).keypress(function(e) {
    $("div").hide();  
    $("div").show();
});

考虑@ nomad的评论：

如果您想触发特定键上的内容，可以使用Javascript Key Codes

例如

$(document).keypress(function(e) {
    if(e.which == 26) {
        alert('You pressed shift key');           
    }        
});

Answer 3

识别按下哪个字母的简便方法

$(document).keypress( function( e ) {
   var key = String.fromCharCode( e.which );
   switch( key ) {
      case 'A':
          $('div').hide();
      break;

      case 'S':
          $('div').show();
      break;
   }
});

Answer 4

当你这样做时：

$("div").hide();

你正在隐藏页面上的所有div。您正在使用的选择器是div标签，因此将选择标签为“div”的所有元素，并将hide（）应用于它们。所以你已经隐藏并在页面上显示所有div。

要在按下特定键时显示它们，并在按下其他键时隐藏它们，您可以执行以下操作。这将显示按下a或A时的div，当按下b或B时隐藏它们。

$(document).onkeypress(function(e)){
   if (e.which == 97 || e.which == 65){
       $("div").show();
   }else if (e.which == 98 || e.which == 66){
       $("div").hide();
   }
 });

在键盘按下隐藏和显示所有div

4 个答案: