event.pageX是jQuery中的内置属性,用于查找鼠标指针相对于文档左边的位置。
用法:
event.pageX
参数:它不接受任何参数,因为它是属性而不是函数。
返回值:它返回鼠标指针相对于文档左边的位置。
jQuery代码显示event.pageX属性的工作方式:
代码1:
在下面的代码中,显示了鼠标指针的左上位置。
<html>
<head>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
<!-- jQuery code to demonstrate the x-coordinate of mouse pointer-->
$(document).ready(function() {
$(document).mousemove(function(event) {
$("span").text("X= " + event.pageX);
});
});
</script>
</head>
<body>
<!-- top left position of the pointer will show here -->
<p>X co-ordinate position of the mouse-pointer is : <span></span></p>
</body>
</html>
输出:
代码2:
在下面的代码中,显示了鼠标指针的右上角位置。
<html>
<head>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
<!-- jQuery code o demonstrate the mouse pointer position -->
$(document).ready(function() {
$(document).mousemove(function(event) {
$("span").text("X= " + event.pageX);
});
});
</script>
</head>
<body>
<!-- top right corner position of the pointer will show here -->
<p>X co-ordinate position of the mouse-pointer is : <span></span></p>
</body>
</html>
输出:
相关用法
- JQuery event.which用法及代码示例
- JQuery event.result用法及代码示例
- JQuery event.type用法及代码示例
- JQuery event.pageY用法及代码示例
- JQuery jQuery.fx.interval用法及代码示例
- JQuery jQuery.support用法及代码示例
- JQuery jQuery.fx.off用法及代码示例
- JQuery jquery用法及代码示例
- JQuery length用法及代码示例
- JQuery context用法及代码示例
- JQuery event.namespace用法及代码示例
- JQuery event.timeStamp用法及代码示例
- JQuery event.currentTarget用法及代码示例
- JQuery event.data用法及代码示例
注:本文由纯净天空筛选整理自kundankumarjha大神的英文原创作品 jQuery | event.pageX property with Examples。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。