按键盘键更改div内容并刷新div

Question

我有div图片。当我按下键盘上的键时，我想隐藏这些图像。我怎么能这样做？

＆＃13;

＆＃13;

<div>
    <span role="checkbox" aria-checked="true" tabindex="0">
        <img src="checked.gif" role="presentation" alt="" />
        
    </span>
    </div>
    <div>
    <span role="checkbox" aria-checked="true" tabindex="0">
        <img src="checked.gif" role="presentation" alt="" />
        
    </span>
    </div>
    <div>
    <span role="checkbox" aria-checked="false" tabindex="0">
        <img src="unchecked.gif" role="presentation" alt="" />
      
    </span>
    </div>

＆＃13;

＆＃13;

＆＃13;

这是div内容。我想在keypress事件中隐藏这些图像..！

Answer 1

尝试keypress事件

$(document).on('keypress',function(){
$('img').hide()
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<span role="checkbox" aria-checked="true" tabindex="0">
    <img src="checked.gif" role="presentation" alt="" />

</span>
</div>
<div>
<span role="checkbox" aria-checked="true" tabindex="0">
    <img src="checked.gif" role="presentation" alt="" />

</span>
</div>
<div>
<span role="checkbox" aria-checked="false" tabindex="0">
    <img src="unchecked.gif" role="presentation" alt="" />

</span>
</div>

Answer 2

倾听keyup事件，而不是.hide()元素。

＆＃13;

＆＃13;

$(document).ready(function () {
  $('body').keyup(function () {
    $('.img').fadeToggle();
    //$('.img').hide();
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <span role="checkbox" aria-checked="true" tabindex="0" class="img">
    <img src="http://lorempixel.com/200/200/" role="presentation" alt="" />
  </span>
</div>
<div>
  <span role="checkbox" aria-checked="true" tabindex="0" class="img">
    <img src="http://lorempixel.com/200/200/" role="presentation" alt="" />
  </span>
</div>
<div>
  <span role="checkbox" aria-checked="false" tabindex="0" class="img">
    <img src="http://lorempixel.com/200/200/" role="presentation" alt="" />
  </span>
</div>

＆＃13;

＆＃13;

＆＃13;