更改div内容和刷新div时按键盘键

-1

我有一个div与图像。当我按键盘上的按键时，我想要隐藏这些图像。我怎样才能做到这一点？更改div内容和刷新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>

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

来源

2017-06-16 Buddhika Priyabhashana

用JavaScript – unconnected

需要Javascript为。有多个问题应该可以帮助你解决你的问题。如[这个答案]（https://stackoverflow.com/a/16089470/2412895）或[这个答案]（https://stackoverflow.com/questions/2554149/html-javascript-change-div-content）等 – KarelG

HTML代表内容，CSS代表样式，Javascript代表交互性。你有HTML，现在你需要Javascript。 – Clonkex

监听keyup事件，比.hide()元素。

$(document).ready(function() { 
 
    $('body').keyup(function() { 
 
    $('.img').fadeToggle(); 
 
    //$('.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" 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>

来源

2017-06-16 06:36:33 Justinas

我想我明白了你的观点。谢谢。 –

该代码的问题在于，当您发送密钥时动画会排队。所以在你停止按下一个键之后它会继续淡入淡出。你可以通过添加stop（）来修复这个简单的问题。所以你的JS的第3行看起来像这样：'$（'。img'）。stop（）。fadeToggle（）;' –

与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>

来源

2017-06-16 06:35:33 prasanth

哇..它的工作。 –

更改div内容和刷新div时按键盘键

回答

相关问题