From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../zh-cn/web/api/uievent/cancelbubble/index.html | 18 ++ files/zh-cn/web/api/uievent/detail/index.html | 86 +++++++++ files/zh-cn/web/api/uievent/index.html | 192 +++++++++++++++++++++ files/zh-cn/web/api/uievent/ischar/index.html | 23 +++ files/zh-cn/web/api/uievent/pagex/index.html | 105 +++++++++++ files/zh-cn/web/api/uievent/pagey/index.html | 89 ++++++++++ files/zh-cn/web/api/uievent/uievent/index.html | 71 ++++++++ .../uievent/\350\247\206\345\233\276/index.html" | 52 ++++++ 8 files changed, 636 insertions(+) create mode 100644 files/zh-cn/web/api/uievent/cancelbubble/index.html create mode 100644 files/zh-cn/web/api/uievent/detail/index.html create mode 100644 files/zh-cn/web/api/uievent/index.html create mode 100644 files/zh-cn/web/api/uievent/ischar/index.html create mode 100644 files/zh-cn/web/api/uievent/pagex/index.html create mode 100644 files/zh-cn/web/api/uievent/pagey/index.html create mode 100644 files/zh-cn/web/api/uievent/uievent/index.html create mode 100644 "files/zh-cn/web/api/uievent/\350\247\206\345\233\276/index.html" (limited to 'files/zh-cn/web/api/uievent') diff --git a/files/zh-cn/web/api/uievent/cancelbubble/index.html b/files/zh-cn/web/api/uievent/cancelbubble/index.html new file mode 100644 index 0000000000..cc024ba8b6 --- /dev/null +++ b/files/zh-cn/web/api/uievent/cancelbubble/index.html @@ -0,0 +1,18 @@ +--- +title: event.cancelBubble +slug: Web/API/UIEvent/cancelBubble +translation_of: Web/API/UIEvent/cancelBubble +--- +

{{ ApiRef() }}

+
+ 警告: 请使用 event.stopPropagation() 方法来代替该不标准的属性.
+

概述

+

{{ Deprecated_header() }} 获取或设置一个布尔值,表明当前事件是否要取消冒泡.

+

语法

+
event.cancelBubble = bool;
+var bool = event.cancelBubble;
+
+

bool 的值为true或false.

+

备注

+

如果一个事件是可冒泡的,则它的cancelBubble属性的默认值为 false,代表允许该事件向上冒泡. 将cancelBubble属性设置为true以后,可以阻止该事件的进一步冒泡行为.

+

{{ languages( { "pl": "pl/DOM/event.cancelBubble" ,"en": "en/DOM/event.cancelBubble" } ) }}

diff --git a/files/zh-cn/web/api/uievent/detail/index.html b/files/zh-cn/web/api/uievent/detail/index.html new file mode 100644 index 0000000000..277f89be04 --- /dev/null +++ b/files/zh-cn/web/api/uievent/detail/index.html @@ -0,0 +1,86 @@ +--- +title: UIEvent.detail +slug: Web/API/UIEvent/detail +translation_of: Web/API/UIEvent/detail +--- +

{{APIRef("DOM Events")}}

+ +

UIEvent.detail是只读属性, 当值为非空的时候, 提供当前点击数(和环境有关) 。

+ +

对 {{event("click")}} 或者 {{event("dblclick")}} 事件, UIEvent.detail 是当前点击数量。

+ +

对 {{event("mousedown")}} 或者 {{event("mouseup")}} 事件, UIEvent.detail是1加上当前点击数。

+ +

对所有的其它{{domxref("UIEvent")}} 对象, UIEvent.detail 总是零.

+ +

Specifications

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('DOM3 Events','#widl-UIEvent-detail','UIEvent.detail')}}{{Spec2('DOM3 Events')}} 
{{SpecName('DOM2 Events','#Events-UIEvent-detail','UIEvent.detail')}}{{Spec2('DOM2 Events')}}Initial definition.
+ +

Browser compatibility

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}{{CompatUnknown()}}
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureFirefox Mobile (Gecko)AndroidIE MobileOpera MobileSafari Mobile
Basic support{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
diff --git a/files/zh-cn/web/api/uievent/index.html b/files/zh-cn/web/api/uievent/index.html new file mode 100644 index 0000000000..afad06a4e3 --- /dev/null +++ b/files/zh-cn/web/api/uievent/index.html @@ -0,0 +1,192 @@ +--- +title: UIEvent +slug: Web/API/UIEvent +tags: + - API + - DOM + - Event + - Reference + - UIEvent +translation_of: Web/API/UIEvent +--- +

{{APIRef("DOM Events")}}

+ +

 UIEvent 接口表示简单的用户界面事件。

+ +

UIEvent 是从 {{domxref("Event")}} 派生出来的。尽管 {{domxref("UIEvent.initUIEvent()")}} 方法为了向后兼容而一直保留着，但是你应该使用 {{domxref("UIEvent.UIEvent", "UIEvent()")}} 构造器来创建 UIEvent 对象。

+ +

某些接口是这个的直接或间接后代：{{domxref("MouseEvent")}}, {{domxref("TouchEvent")}}, {{domxref("FocusEvent")}}, {{domxref("KeyboardEvent")}}, {{domxref("WheelEvent")}}, {{domxref("InputEvent")}}, 和{{domxref("CompositionEvent")}}.

+ +

Constructors

+ +
+
{{domxref("UIEvent.UIEvent()", "UIEvent()")}}
+
创建一个 UIEvent 对象
+
+ +

属性

+ +

也继承了父代 {{domxref("Event")}} 的一些属性。

+ +
+
{{domxref("UIEvent.cancelBubble")}} {{Non-standard_inline}} {{Deprecated_inline}}
+
返回一个 {{jsxref("Boolean")}}，表示该事件的冒泡是否被取消。
+
+ +
+
{{domxref("UIEvent.detail")}}{{readonlyinline}}
+
Returns a long with details about the event, depending on the event type.
+
{{domxref("UIEvent.isChar")}} {{obsolete_inline}} {{readonlyinline}}
+
返回一个 {{jsxref("Boolean")}}，表示该事件是否产生了一个键盘字符（key character）。
+
{{domxref("UIEvent.layerX")}} {{Non-standard_inline}} {{readonlyinline}}
+
返回事件相对于当前层的水平坐标。
+
{{domxref("UIEvent.layerY")}} {{Non-standard_inline}} {{readonlyinline}}
+
返回事件相对于当前层的垂直坐标。
+
{{domxref("UIEvent.pageX")}} {{Non-standard_inline}} {{readonlyinline}}
+
返回事件相对于整个文档的水平坐标。
+
{{domxref("UIEvent.pageY")}} {{Non-standard_inline}} {{readonlyinline}}
+
返回事件相对于整个文档的垂直坐标。
+
{{domxref("UIEvent.sourceCapabilities")}} {{non-standard_inline}} {{readonlyinline}}
+
返回输入设备功能接口的一个实例，它提供有关负责生成 touch 事件的物理设备的信息。
+
{{domxref("UIEvent.view")}}{{readonlyinline}}
+
返回一个包含了产生该事件的视图的 {{domxref("WindowProxy")}} 。
+
{{domxref("UIEvent.which")}} {{Non-standard_inline}} {{readonlyinline}} 
+
返回一个对应（键盘）按下的数字类型的 keyCode ，或者一个字母数字键按下时的字符码(charCode)。
+
+ +

方法

+ +

也继承了父代 {{domxref("Event")}} 的一些方法。

+ +
+
{{domxref("UIEvent.initUIEvent()")}} {{deprecated_inline}}
+
初始化一个 UIEvent 对象。如果事件已经被分派，这个方法什么都不做。
+
+ +

规范

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('InputDeviceCapabilities')}}{{Spec2('InputDeviceCapabilities')}}Added sourceCapabilities property.
{{SpecName('DOM3 Events', '#interface-UIEvent', 'UIEvent')}}{{Spec2('DOM3 Events')}}Added the UIEvent() constructor, deprecated the initUIEvent() method and changed the type of viewfrom AbstractView to WindowProxy.
{{SpecName('DOM2 Events', '#Events-UIEvent', 'UIEvent')}}{{Spec2('DOM2 Events')}}Initial definition
+ +

浏览器兼容性

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}[2]{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}
UIEvent(){{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatGeckoDesktop(11)}}{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}
cancelBubble defined on Event{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatGeckoDesktop(53)}}[1]{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}[2]{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}
UIEvent(){{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatGeckoMobile(11)}}{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}
cancelBubble defined on Event{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatGeckoMobile(53)}}[1]{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

[1] From Firefox 52, this property is now defined on the {{domxref("Event")}} interface instead. See {{bug(1298970)}} for more details.

+ +

[2] The {{domxref("UIEvent.isChar", "isChar")}} property has never been supported by any browser but Firefox, and even on Firefox it's never worked except on Mac OSX. For that reason, it's been removed in Firefox 55 to align with other browsers.

+ +

相关链接

+ + diff --git a/files/zh-cn/web/api/uievent/ischar/index.html b/files/zh-cn/web/api/uievent/ischar/index.html new file mode 100644 index 0000000000..8d6097d123 --- /dev/null +++ b/files/zh-cn/web/api/uievent/ischar/index.html @@ -0,0 +1,23 @@ +--- +title: event.isChar +slug: Web/API/UIEvent/isChar +translation_of: Web/API/UIEvent/isChar +--- +

{{ ApiRef() }}

+
+ 警告: 不要使用该属性,该属性有一个已知的bug,就是它始终返回false,从不返回true.查看https://bugzilla.mozilla.org/show_bug.cgi?id=312552
+

概述

+

返回一个布尔值,表明该事件是否是由一个字符按键触发的.

+

语法

+
bool = event.isChar
+
+

例子

+
 if(e.isChar){
+   echoInput(e.type);
+ }
+
+

备注

+

一些常用的组合键可能会触发键盘事件,但是不会产生任何字符(例如:CTRL + ALT + ?).在这种情况下,isChar返回false.isChar常用于判断用户在一个文本输入框内输入的是否为一个字符.

+

规范

+

不属于任何公开的规范

+

{{ languages( {"pl": "pl/DOM/event.isChar","en": "en/DOM/event.isChar" } ) }}

diff --git a/files/zh-cn/web/api/uievent/pagex/index.html b/files/zh-cn/web/api/uievent/pagex/index.html new file mode 100644 index 0000000000..b4a7f812f7 --- /dev/null +++ b/files/zh-cn/web/api/uievent/pagex/index.html @@ -0,0 +1,105 @@ +--- +title: UIEvent.pageX +slug: Web/API/UIEvent/pageX +translation_of: Web/API/UIEvent/pageX +--- +

{{APIRef("DOM Events")}} {{Non-standard_header}}

+ +

UIEvent.pageX 是只读属性，它返回相对于整个文档的水平坐标。

+ +

语法

+ +
var pos = event.pageX
+ +

示例

+ +
var pageX = event.pageX;
+ +

pageX  是鼠标事件触发时，鼠标指针相对于整个文档 X 坐标上像素点的整数值。这一属性同时也参照了页面的水平滚动距离。

+ +
<html>
+<head>
+<title>pageX\pageY & layerX\layerY example</title>
+
+<script type="text/javascript">
+
+function showCoords(evt){
+  var form = document.forms.form_coords;
+  var parent_id = evt.target.parentNode.id;
+  form.parentId.value = parent_id;
+  form.pageXCoords.value = evt.pageX;
+  form.pageYCoords.value = evt.pageY;
+  form.layerXCoords.value = evt.layerX;
+  form.layerYCoords.value = evt.layerY;
+}
+
+</script>
+
+<style type="text/css">
+
+ #d1 {
+  border: solid blue 1px;
+  padding: 20px;
+ }
+
+ #d2 {
+  position: absolute;
+  top: 180px;
+  left: 80%;
+  right:auto;
+  width: 40%;
+  border: solid blue 1px;
+  padding: 20px;
+ }
+
+ #d3 {
+  position: absolute;
+  top: 240px;
+  left: 20%;
+  width: 50%;
+  border: solid blue 1px;
+  padding: 10px;
+ }
+
+</style>
+</head>
+
+<body onmousedown="showCoords(event)">
+
+<p>To display the mouse coordinates please click anywhere on the page.</p>
+
+<div id="d1">
+<span>This is an un-positioned div so clicking it will return
+layerX/layerY values almost the same as pageX/PageY values.</span>
+</div>
+
+<div id="d2">
+<span>This is a positioned div so clicking it will return layerX/layerY
+values that are relative to the top-left corner of this positioned
+element. Note the pageX\pageY properties still return the
+absolute position in the document, including page scrolling.</span>
+
+<span>Make the page scroll more! This is a positioned div so clicking it
+will return layerX/layerY values that are relative to the top-left
+corner of this positioned element. Note the pageX\pageY properties still
+return the absolute position in the document, including page
+scrolling.</span>
+</div>
+
+<div id="d3">
+<form name="form_coords">
+ Parent Element id: <input type="text" name="parentId" size="7" /><br />
+ pageX:<input type="text" name="pageXCoords" size="7" />
+ pageY:<input type="text" name="pageYCoords" size="7" /><br />
+ layerX:<input type="text" name="layerXCoords" size="7" />
+ layerY:<input type="text" name="layerYCoords" size="7" />
+</form>
+</div>
+
+</body>
+</html>
+
+ +

规范

+ +

这一属性不在规范中。

diff --git a/files/zh-cn/web/api/uievent/pagey/index.html b/files/zh-cn/web/api/uievent/pagey/index.html new file mode 100644 index 0000000000..6c504d3f52 --- /dev/null +++ b/files/zh-cn/web/api/uievent/pagey/index.html @@ -0,0 +1,89 @@ +--- +title: event.pageY +slug: Web/API/UIEvent/pageY +translation_of: Web/API/UIEvent/pageY +--- +

{{ ApiRef() }}

+

概述

+

返回事件发生时相对于整个文档的纵坐标.

+

语法

+
var pageY = event.pageY;
+
+

pageY 是事件发生时鼠标指针所在位置相对于整个文档的纵坐标,单位为像素.该属性会考虑到页面滚动条的高度.

+

例子

+
<html>
+<head>
+<title>pageX\pageY & layerX\layerY example</title>
+
+<script type="text/javascript">
+
+function showCoords(evt){
+  var form = document.forms.form_coords;
+  var parent_id = evt.target.parentNode.id;
+  form.parentId.value = parent_id;
+  form.pageXCoords.value = evt.pageX;
+  form.pageYCoords.value = evt.pageY;
+  form.layerXCoords.value = evt.layerX;
+  form.layerYCoords.value = evt.layerY;
+}
+
+</script>
+
+<style type="text/css">
+
+ #d1 {
+  border: solid blue 1px;
+  padding: 20px;
+ }
+
+ #d2 {
+  position: absolute;
+  top: 180px;
+  left: 80%;
+  right:auto;
+  width: 40%;
+  border: solid blue 1px;
+  padding: 20px;
+ }
+
+ #d3 {
+  position: absolute;
+  top: 240px;
+  left: 20%;
+  width: 50%;
+  border: solid blue 1px;
+  padding: 10px;
+ }
+
+</style>
+</head>
+
+<body onmousedown="showCoords(event)">
+
+<p>要显示鼠标所在位置的坐标,请点击页面上的任意地方.</p>
+
+<div id="d1">
+<span>这是一个未定位的div(没有指定css position属性),所以点击它返回的layerX/layerY值几乎和pageX/PageY值完全相同.</span>
+</div>
+
+<div id="d2">
+<span>这是一个已定位的div,因此点击它时返回的layerX/layerY的值是相对于自己左上角(top-left)位置的坐标值.
+然而pageX/pageY属性仍返回该div在文档中的绝对位置,包括页面滚动高度.</span>
+</div>
+
+<div id="d3">
+<form name="form_coords">
+ 父元素id: <input type="text" name="parentId" size="7" /><br />
+ pageX:<input type="text" name="pageXCoords" size="7" />
+ pageY:<input type="text" name="pageYCoords" size="7" /><br />
+ layerX:<input type="text" name="layerXCoords" size="7" />
+ layerY:<input type="text" name="layerYCoords" size="7" />
+</form>
+</div>
+
+</body>
+</html>
+
+

规范

+

不属于任何公开的标准.

+

{{ languages( {"pl": "pl/DOM/event.pageY","en": "en/DOM/event.pageY" } ) }}

diff --git a/files/zh-cn/web/api/uievent/uievent/index.html b/files/zh-cn/web/api/uievent/uievent/index.html new file mode 100644 index 0000000000..d80f3c7f0e --- /dev/null +++ b/files/zh-cn/web/api/uievent/uievent/index.html @@ -0,0 +1,71 @@ +--- +title: UIEvent() +slug: Web/API/UIEvent/UIEvent +translation_of: Web/API/UIEvent/UIEvent +--- +
{{APIRef("DOM Events")}}
+ +

UIEvent() 作为构造函数，可用于构造一个新的 {{domxref("UIEvent")}} 对象.

+ +

语法

+ +
event = new UIEvent(typeArg [, UIEventInit])
+ +

Values

+ +
+
typeArg
+
传递的是一个 {{domxref("DOMString")}}类型的字符串，用来命名且重新发布的事件。
+
UIEventInit {{optional_inline}}
+
+ +
+
是 UIEventInit 集合, 它拥有以下属性: + +
    +
  • detail: 可选，默认为long类型的0数值， 用来标记事件的关联值. {{domxref("UIEvent.detail")}} 列出了标准事件的语义.
    • +
  • view: 可选，默认为null，类型为 {{domxref("WindowProxy")}}, 用来关联{{domxref("Window")}} 与event本身.
    • +
  • sourceCapabilities: {{non-standard_inline}} 一个 {{domxref("InputDeviceCapabilities")}} 类型的接口实例(对象)，用来提供物理设备的触摸信息。
    • +
+ +
+

UIEventInit 合集依然接受从{{domxref("Event.Event", "EventInit")}} 定义来的合集.

+
+
+
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('InputDeviceCapabilities')}}{{Spec2('InputDeviceCapabilities')}}Added sourceCapabilities property.
{{SpecName('DOM3 Events','#interface-UIEvent','UIEvent()')}}{{Spec2('DOM3 Events')}}Initial definition.
+ +

浏览器兼容性

+ + + +

{{Compat("api.UIEvent.UIEvent")}}

+ +

See also

+ + diff --git "a/files/zh-cn/web/api/uievent/\350\247\206\345\233\276/index.html" "b/files/zh-cn/web/api/uievent/\350\247\206\345\233\276/index.html" new file mode 100644 index 0000000000..66b72f2637 --- /dev/null +++ "b/files/zh-cn/web/api/uievent/\350\247\206\345\233\276/index.html" @@ -0,0 +1,52 @@ +--- +title: 用户界面项目视图 +slug: Web/API/UIEvent/视图 +tags: + - API + - DOM + - UI + - 参考 + - 只读 + - 属性 +translation_of: Web/API/UIEvent/view +--- +

{{APIRef("DOM Events")}}

+ +

The UIEvent.view 只读属性返回的生成事件的 {{domxref("document.defaultView")}} (window of the document) 对象。在浏览器中，这是事件所在的 {{ domxref("Window") }} 对象。

+ +

语法

+ +
var view = event.view;
+
+ + + +

技术参数

+ + + + + + + + + + + + + + + + + + + +
规格状态注释
{{SpecName('DOM3 Events', '#interface-UIEvent', 'UIEvent')}}{{Spec2('DOM3 Events')}}从 {{SpecName('DOM2 Events')}}, 将 view 类型从 AbstractView 更改为 WindowProxy.
{{SpecName('DOM2 Events', '#Events-UIEvent', 'UIEvent')}}{{Spec2('DOM2 Events')}}最初的定义。
+ +

浏览器的兼容性

+ + + +

{{Compat("api.UIEvent.view")}}

-- cgit v1.2.3-54-g00ecf