From 32ce5de47456ff5d8cb1b2d9163356ce27ffe955 Mon Sep 17 00:00:00 2001 From: MDN Date: Sun, 16 Jan 2022 00:57:29 +0000 Subject: [CRON] sync translated content --- files/zh-cn/_redirects.txt | 1 + files/zh-cn/_wikihistory.json | 14 ++--- .../conflicting/web/api/pointer_events/index.html | 66 ++++++++++++++++++++++ .../index.html | 65 --------------------- 4 files changed, 74 insertions(+), 72 deletions(-) create mode 100644 files/zh-cn/conflicting/web/api/pointer_events/index.html delete mode 100644 files/zh-cn/web/api/touch_events/supporting_both_touchevent_and_mouseevent/index.html (limited to 'files/zh-cn') diff --git a/files/zh-cn/_redirects.txt b/files/zh-cn/_redirects.txt index 70c0330c9b..1a0110161e 100644 --- a/files/zh-cn/_redirects.txt +++ b/files/zh-cn/_redirects.txt @@ -1496,6 +1496,7 @@ /zh-CN/docs/Web/API/Touch.screenX /zh-CN/docs/Web/API/Touch/screenX /zh-CN/docs/Web/API/Touch.screenY /zh-CN/docs/Web/API/Touch/screenY /zh-CN/docs/Web/API/TouchEvent.changedTouches /zh-CN/docs/Web/API/TouchEvent/changedTouches +/zh-CN/docs/Web/API/Touch_events/Supporting_both_TouchEvent_and_MouseEvent /zh-CN/docs/conflicting/Web/API/Pointer_events /zh-CN/docs/Web/API/UIEvent/pageX /zh-CN/docs/conflicting/Web/API/MouseEvent/pageX /zh-CN/docs/Web/API/UIEvent/pageY /zh-CN/docs/conflicting/Web/API/MouseEvent/pageY /zh-CN/docs/Web/API/UIEvent/视图 /zh-CN/docs/Web/API/UIEvent/view diff --git a/files/zh-cn/_wikihistory.json b/files/zh-cn/_wikihistory.json index 5b817efe66..316c67967b 100644 --- a/files/zh-cn/_wikihistory.json +++ b/files/zh-cn/_wikihistory.json @@ -20645,13 +20645,6 @@ "meteorlxy" ] }, - "Web/API/Touch_events/Supporting_both_TouchEvent_and_MouseEvent": { - "modified": "2019-08-24T04:59:47.192Z", - "contributors": [ - "ouxuwen", - "meteorlxy" - ] - }, "Web/API/Touch_events/Using_Touch_Events": { "modified": "2019-03-23T22:09:03.982Z", "contributors": [ @@ -47197,6 +47190,13 @@ "AlexChao" ] }, + "conflicting/Web/API/Pointer_events": { + "modified": "2019-08-24T04:59:47.192Z", + "contributors": [ + "ouxuwen", + "meteorlxy" + ] + }, "conflicting/Web/API/Push_API": { "modified": "2019-03-23T22:26:22.995Z", "contributors": [ diff --git a/files/zh-cn/conflicting/web/api/pointer_events/index.html b/files/zh-cn/conflicting/web/api/pointer_events/index.html new file mode 100644 index 0000000000..7b579d5250 --- /dev/null +++ b/files/zh-cn/conflicting/web/api/pointer_events/index.html @@ -0,0 +1,66 @@ +--- +title: 同时支持触屏事件和鼠标事件 +slug: conflicting/Web/API/Pointer_events +translation_of: Web/API/Touch_events/Supporting_both_TouchEvent_and_MouseEvent +original_slug: Web/API/Touch_events/Supporting_both_TouchEvent_and_MouseEvent +--- +

{{DefaultAPISidebar("Touch Events")}}

+ +

{{domxref("Touch_events","touch")}} 接口使得应用可以提高触屏设备上的用户体验。然而,现在绝大多数的web内容都是为鼠标操作而设计的。因此,即使浏览器支持触屏,也必须要模拟(emulate)鼠标事件,这样即使是那些只能接受鼠标输入的内容,也不需要进行额外修改就可以正常工作。

+ +

理想状态下,一个基于触屏的应用不需要去明确指定鼠标输入。然而,由于浏览器必须要模拟(emulate)鼠标事件,很有可能有一些特定的交互问题需要去处理。下面列出了这些交互的细节 ,并指导应用开发者该如何去处理它们。

+ +

事件触发

+ +

触摸事件标准定义了一些关于触摸和鼠标交互的浏览器要求(有关详细信息,请参阅与鼠标事件的交互和单击部分),注意浏览器可以触发触摸事件和鼠标事件以响应相同的用户输入。本节介绍可能影响应用程序的条件。

+ +

如果浏览器因单个用户输入而触发触摸和鼠标事件,则浏览器必须在任何鼠标事件之前触发{{event("touchstart")}}。因此,如果应用程序不希望在特定触摸{{domxref("Touch.target","target")}} 元素上触发鼠标事件,则元素的触摸事件处理程序应调用{{domxref("Event.preventDefault()","preventDefault()")}}并且不会调度其他鼠标事件。

+ +

这是{{event("touchmove")}}事件处理程序调用的代码片段

+ +

preventDefault().

+ +
// touchmove handler
+function process_touchmove(ev) {
+  // Call preventDefault() to prevent any further handling
+  ev.preventDefault();
+}
+
+ +

事件顺序

+ +

虽然触摸和鼠标事件的特定顺序是根据实际情况而定的,但标准表明事件执行顺序是固定的:对于单个输入:

+ + + +

如果 {{event("touchstart")}}, {{event("touchmove")}} 或者 {{event("touchend")}} 在触摸的过程中触发了touchcancel事件,后面的鼠标事件将不会被触发,由此产生的事件序列只是:

+ + + +

社区

+ + + +

相关主题和资源

+ + diff --git a/files/zh-cn/web/api/touch_events/supporting_both_touchevent_and_mouseevent/index.html b/files/zh-cn/web/api/touch_events/supporting_both_touchevent_and_mouseevent/index.html deleted file mode 100644 index 99f5ee55f7..0000000000 --- a/files/zh-cn/web/api/touch_events/supporting_both_touchevent_and_mouseevent/index.html +++ /dev/null @@ -1,65 +0,0 @@ ---- -title: 同时支持触屏事件和鼠标事件 -slug: Web/API/Touch_events/Supporting_both_TouchEvent_and_MouseEvent -translation_of: Web/API/Touch_events/Supporting_both_TouchEvent_and_MouseEvent ---- -

{{DefaultAPISidebar("Touch Events")}}

- -

{{domxref("Touch_events","touch")}} 接口使得应用可以提高触屏设备上的用户体验。然而,现在绝大多数的web内容都是为鼠标操作而设计的。因此,即使浏览器支持触屏,也必须要模拟(emulate)鼠标事件,这样即使是那些只能接受鼠标输入的内容,也不需要进行额外修改就可以正常工作。

- -

理想状态下,一个基于触屏的应用不需要去明确指定鼠标输入。然而,由于浏览器必须要模拟(emulate)鼠标事件,很有可能有一些特定的交互问题需要去处理。下面列出了这些交互的细节 ,并指导应用开发者该如何去处理它们。

- -

事件触发

- -

触摸事件标准定义了一些关于触摸和鼠标交互的浏览器要求(有关详细信息,请参阅与鼠标事件的交互和单击部分),注意浏览器可以触发触摸事件和鼠标事件以响应相同的用户输入。本节介绍可能影响应用程序的条件。

- -

如果浏览器因单个用户输入而触发触摸和鼠标事件,则浏览器必须在任何鼠标事件之前触发{{event("touchstart")}}。因此,如果应用程序不希望在特定触摸{{domxref("Touch.target","target")}} 元素上触发鼠标事件,则元素的触摸事件处理程序应调用{{domxref("Event.preventDefault()","preventDefault()")}}并且不会调度其他鼠标事件。

- -

这是{{event("touchmove")}}事件处理程序调用的代码片段

- -

preventDefault().

- -
// touchmove handler
-function process_touchmove(ev) {
-  // Call preventDefault() to prevent any further handling
-  ev.preventDefault();
-}
-
- -

事件顺序

- -

虽然触摸和鼠标事件的特定顺序是根据实际情况而定的,但标准表明事件执行顺序是固定的:对于单个输入:

- - - -

如果 {{event("touchstart")}}, {{event("touchmove")}} 或者 {{event("touchend")}} 在触摸的过程中触发了touchcancel事件,后面的鼠标事件将不会被触发,由此产生的事件序列只是:

- - - -

社区

- - - -

相关主题和资源

- - -- cgit v1.2.3-54-g00ecf