MouseEvent.clientX

MouseEvent.clientX 是只读属性， 它提供事件发生时的应用客户端区域的水平坐标 (与页面坐标不同)。例如，不论页面是否有水平滚动，当你点击客户端区域的左上角时，鼠标事件的 clientX 值都将为 0 。最初这个属性被定义为长整型（long integer），如今 CSSOM 视图模块将其重新定义为双精度浮点数（double float）。你可以查阅浏览器兼容性部分的文档来进一步了解有关信息。

语法


var x = instanceOfMouseEvent.clientX

返回值

被 CSSOM View Module 重新定义为一个 double 类型的浮点值. 原来这个属性是被定义为一个 long 整数. 可以在 "浏览器兼容性" 那里查看详细内容.

示例

<!DOCTYPE html> 
<html>
  <head>
    <title>clientX/clientY example</title>

    <script>
      function showCoords(evt){
        alert(
          "clientX value: " + evt.clientX + "\n" +
          "clientY value: " + evt.clientY + "\n"
        );
      }
    </script>
  </head>
  <body onmousedown="showCoords(event)">
    <p>To display the mouse coordinates click anywhere on the page.</p>
  </body>
</html>

规范

Specification Status Comment
CSS Object Model (CSSOM) View Module
clientX		 Working Draft Redefines MouseEvent from long to double.
Document Object Model (DOM) Level 3 Events Specification
MouseEvent.clientX		 Obsolete No change from Document Object Model (DOM) Level 2 Events Specification.
Document Object Model (DOM) Level 2 Events Specification
MouseEvent.clientX		 Obsolete Initial definition.

浏览器兼容性

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
clientXChrome Full support 1Edge Full support 12Firefox Full support 1IE Full support 9Opera Full support 10.6Safari Full support 3.1WebView Android Full support 1Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support 11Safari iOS Full support 2Samsung Internet Android Full support 1.0
Value type changed from long to doubleChrome Full support 56Edge Full support ≤79Firefox ? IE ? Opera ? Safari ? WebView Android Full support 56Chrome Android Full support 56Firefox Android ? Opera Android ? Safari iOS ? Samsung Internet Android Full support 6.0

Legend

Full support  
Full support
Compatibility unknown  
Compatibility unknown

相关

相关主题