[jQuery] Mousemove, Mouseover 事件

[jQuery] Mousemove, Mouseover 事件

說明:

  • Mousemove:滑鼠移動時觸發事件
  • Mouseover:滑鼠在上面觸發事件
  • 例如:滑鼠移動時,抓取滑鼠位置並且顯示

範例:

<HEAD>
<script type="Text/JavaScript" src="js/jQuery.js"></script>
<script type="Text/JavaScript">
$(document).ready(function(){
	$(document).mousemove(function(e){
		$(':input[name="txtX"]').val(e.pageX);
		$(':input[name="txtY"]').val(e.pageY);
		return true;
	});
	$(':input').mouseover(function(){
		$('#disp').text($(this).attr('name'));
	});
})
</script>
<style type="Text/Css">
	.iOver
	{
		background-Color:yellow;
		color:blue;
	}
	.iOut
	{
		background-Color:;
		color:black;
	}
</style>
</HEAD>
<BODY>
<FORM action="" method=POST id=form1 name=form1>
X:<input type="text" id="txtX" name="txtX" value="" /><br />
Y:<input type="text" id="txtY" name="txtY" value="" /><br />
<span id="disp">span</span>

</FORM>
</BODY>
</HTML>

 


以下是簽名:


Microsoft MVP
Visual Studio and Development Technologies
(2005~2019/6) 
topcat
Blog:http://www.dotblogs.com.tw/topcat