jQuery事件方法

Original 2018-11-26 21:50:47 213
abstract:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>jquery事件方法2</title> <script type="text/javascript" src="
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jquery事件方法2</title>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
</head>
<body>


<script type="text/javascript">
$(document).ready(function(){
$(document).mousemove(function(aa){
$("span").text("x:"+aa.pageX+"y:"+aa.pageY)
})

a=0
$(window).resize(function(){
$("b").text(a++)
})

$(".one").mouseenter(function(){
$(".one").css("background","blue")
})

$(".two").mouseover(function(){
$(".two").css("width","50px")
})

$(".three").mouseout(function(){
$(".three").css("height","50px")
})

$(".four").mousedown(function(){
$(".four").css({"width":"50px","height":"50px"})
})

$(".five").mouseup(function(){
$(".five").css({"width":"200px","height":"200px","background":"green"})
})

})

</script>

<div>当前鼠标的位置:<span></span></div>
<div>页面被调整大小的次数:<b></b></div>
<div style="width:100px;height: 100px;background: red"></div><br>
<div style="width:100px;height: 100px;background: red"></div><br>
<div style="width:100px;height: 100px;background: red"></div><br>
<div style="width:100px;height: 100px;background: red"></div><br>
<div style="width:100px;height: 100px;background: red"></div><br>


 </body>
</html>

mouseover() 	当鼠标指针位于元素上方时会发生mouseover事件
mouseenter() 	当鼠标指针穿过元素时会发生mouseenter事件
mousemove() 	当鼠标指针在指定的元素中移动时,就会发生mousemove事件
mouseleave()  	当鼠标指针离开元素时,就会发生mouseleave
mouseout() 	当鼠标指针从元素上移开时,就会发生mouseout
mousedown()  	当鼠标指针移动到元素上方并按下按键时)
mouseup()  	当在元素上松开鼠标按键时
resize() 	当调整当前浏览器窗口大小时
pageX() 	属性是鼠标指针的位置,相对于文档的左边缘 event.pageX  event:必需 参数来自事件绑定函数
pageY()  	属性是鼠标指针的位置,相对于文档的右边缘 event.pageY  event:必需 参数来自事件绑定函数

$(".four").mousedown(function(){
$(".four").css({"width":"50px","height":"50px"})
})   // 在改变多个属性的时候,
        1、每个属性,和属性值都要有引号,
        2、属性和属性对应的属性值之间有冒号,
        3、一定要有花括号将多个属性包起来
        在写选择器的时候,一定要定位准确,因为有多个div,没有准确
        定位的话,容易出错。


Release Notes

Popular Entries