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

时间:2017-06-16 06:31:43

标签: javascript jquery html css

我有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="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事件中隐藏这些图像..!

2 个答案:

答案 0 :(得分:0)

尝试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>

答案 1 :(得分:0)

倾听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;