关于jQuery的练习
<!--
试着使用课程里学到的事件委托,实现每点击一个卡片,在卡片上显示出来卡片里隐藏的数字。
任务
1、 注意事件委托借助了事件冒泡的机制,在父节点添加事件,事件里根据目标对象的不同,执行不同的操作;
2、 注意把文字显示出来的方法,可以通过设置css样式或者增加类,比如使用addClass
-->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>习题</title>
<style>
.cards div {
float: left;
margin: 10px;
width: 100px;
height: 100px;
color: #fff;
font-size: 50px;
text-align: center;
line-height: 100px;
text-indent: -9999px;
background-color: #333;
}
</style>
</head>
<body>
<h1>添加事件处理</h1>
<div class="cards">
<div>43</div>
<div>21</div>
<div>56</div>
<div>94</div>
<div>46</div>
<div>26</div>
<div>67</div>
<div>90</div>
<div>25</div>
<div>10</div>
<div>84</div>
<div>76</div>
</div>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script>
$(function () {
$('div.cards').on('click',function(event){
$(this).css({'color':'white',});
})
});
</script>
</body>
</html>
为什么我点击卡片不能把数字显示出来?不是已经对div绑定了点击事件,然后改变css的文字颜色,为什么还不能显示数字?0
收起
正在回答 回答被采纳积分+1
2回答
响应式开发与常用框架 2018
- 参与学习 人
- 提交作业 2198 份
- 解答问题 5012 个
如果你有web端基础,既想进阶,又想进军移动端开发,那就来吧,我们专题为你带来的课程有HTML5、CSS3、移动基础、响应式、bootstrap、less等,让你在前端道路上畅通无阻!
了解课程






恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星