javascript - $(this)用法
本文介绍了javascript - $(this)用法的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
<script>
$(document).ready(function() {
$(this).mouseover(function() {
$(this).css('height', '200px');
});
$(this).mouseleave(function() {
$(this).css('height', '100px');
});
});
</script>
</head>
<body>
<div id="div0">
<div class="box" id="div1"></div>
<div class="box" id="div2"></div>
<div class="box" id="div3"></div>
<div class="box" id="div4"></div>
<div class="box" id="div5"></div>
<div class="box" id="div6"></div>
<div class="box" id="div7"></div>
<div class="box" id="div8"></div>
<div class="box" id="div9"></div>
<div class="box" id="div10"></div>
</div>
</body>
这里的为什么无法实现鼠标经过改变指定div的大小?
解决方案
在 ready
事件中,this
是指 document
,所以你的事件并没有绑定在 div
上,而是绑定在 document
上。按你的意思,应该是这样
$(document).ready(function() {
$("div.box")
.mouseover(function() {
$(this).css("height", "200px");
})
.mouseleave(function() {
$(this).css("height", "100px");
});
});
https://jsfiddle.net/0cn8xu1p/
这篇关于javascript - $(this)用法的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文