我正在尝试添加一个按键监听器，它只监听 'a' 的按键，当它被触发时，背景将变成透明的白色，其边框略微变灰。
这就是我所拥有的，但不知何故它不起作用。 (不要介意其他 CSS 类，它们只是用于字体装饰)有人可以告诉我我没有看到的东西吗？
$( "#test" ).keypress(function( event ) {
//I think 97 is the character code for 'a'
if(event.which == 97){
$(this).addClass('.test_card');
}else{
event.preventDefault();
}
});body{background: black;
}
.card{
background-color:transparent;
width:10%;
margin-left:1.25%;
height: 100%;
border: white solid 2px;
display:inline-block;
color: white;
}
.test_card{
background-color: rgba(255, 255, 255, .3);
border: grey solid 2px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<div class="card" id="test">
<h1 class="card__title">A</h1>
<p class="card__description">
Snare
</p>
</div>
</body>最佳答案
在 addClass('.test_card') 中移除 .。还要将事件绑定(bind)到文档而不是 div，以便每次按下 a 时都会触发事件
$(document).keypress(function(event) {
if (event.which == '97') {
$('#test').addClass('test_card');
}
});body {
background: black;
}
.card {
background-color: transparent;
width: 10%;
margin-left: 1.25%;
height: 100%;
border: white solid 2px;
display: inline-block;
color: white;
}
.test_card {
background-color: rgba(255, 255, 255, .3);
border: grey solid 2px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<div class="card" id="test">
<h1 class="card__title">A</h1>
<p class="card__description">
Snare
</p>
</div>
</body>关于jquery - 通过 jquery 将按键功能添加到 div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46922824/