[發明專利]一種基于WEB的同屏多人交互方法

在審

• 申請號: 201910768629.3
• 申請日: 2019-08-20
• 公開（公告）號: CN110568988A
• 公開（公告）日: 2019-12-13
• 發明（設計）人: 周斌
• 申請（專利權）人: 武漢鼎森電子科技有限公司
• 主分類號: G06F3/0488
• 分類號: G06F3/0488
• 代理公司: 42247 武漢紅觀專利代理事務所(普通合伙)
• 代理人: 李季

本發明提出了一種基于WEB的同屏多人交互方法，當用戶的手指在觸控屏上滑動或點擊時，會產生一個事件，這個事件下傳到目標節點，并在目標節點觸發這個事件，為了使這個觸發的這個事件只發生在本區域，不傳遞到其他區域，通過event.stopPropagation()或event.preventDefault()方法阻止觸摸事件的冒泡傳遞，使得觸控屏只響應目標元素上的信息；本發明的方法可以將一塊屏幕按分辨率劃分多個區域，每個區域的觸摸事件不會跨度到另一區域，實現多人同屏操作時，互不干擾。

技術領域

本發明涉及多人交互技術領域，尤其涉及一種基于WEB的同屏多人交互方法。

背景技術

當前，隨著html5的興起，web開發已經承載于各種產品形態中，起到了越來越廣泛的技術支持作用，其中web技術在觸摸屏設備上的應用大大簡化了應用的開發難度和工作量，增加了開發的靈活度。但是由于目前大部分的web應用都是面向單用戶操作使用，在應用的交互形式上有所局限，只能同時供一人操作，當多個人同時操作時，觸摸屏有可能將多人的同時操作理解為單人的雙指操作，或者本屏操作的信息傳遞到另一塊屏上，因此，經常容易出現觸摸屏響應錯誤的現象，降低了應用的使用體驗。因此，為解決上述問題，本發明提供一種基于WEB的同屏多人交互方法，實現觸控屏上的操作信息只在本觸控屏區域響應，不會傳遞到另一塊屏，實現多人同屏操作，互不干擾。

發明內容

有鑒于此，本發明提出了一種基于WEB的同屏多人交互方法，實現觸控屏上的操作信息只在本觸控屏區域響應，不會傳遞到另一塊屏，實現多人同屏操作，互不干擾。

本發明的技術方案是這樣實現的：本發明提供了一種基于WEB的同屏多人交互方法，包括以下步驟：

S1、將觸控屏按分辨率分為多個的區域，并記錄觸控屏上每個區域中每個像素的坐標；

S2、監聽觸控屏上元素的觸摸事件，當發生觸摸事件時，產生事件對象，獲取事件對象，再確定觸摸事件發生的區域；

S3、在觸摸事件發生的區域內阻止觸摸事件的冒泡傳遞；

S4、后臺響應觸摸事件。

在以上技術方案的基礎上，優選的，觸控屏支持多點觸控。

在以上技術方案的基礎上，優選的，S2中觸摸事件包括點觸摸和滑動觸摸。

進一步優選的，S2中事件對象包括觸發事件的橫縱坐標，記為(x,y)。

進一步優選的，S2還包括以下步驟：

S201、通過js監聽觸摸事件，并通過addEventListener()綁定觸摸事件；

S202、當觸摸事件發生時，先捕獲觸摸事件，再找到目標，最后進入冒泡階段；

S203、在捕獲階段捕獲到觸發事件的橫縱坐標(x,y)，根據坐標確定觸發事件發生的目標點。

進一步優選的，S3中通過event.stopPropagation()或event.preventDefault()方法阻止觸摸事件的冒泡傳遞。

本發明的一種基于WEB的同屏多人交互方法相對于現有技術具有以下有益效果：

(1)通過使用DOM模型將網頁轉為一個JavaScript對象，從而可以用腳本進行各種操作，瀏覽器會根據DOM模型，將結構化文檔解析成一系列的節點，再由這些節點組成一個樹狀結構，所有的節點和最終的樹狀結構，都有規范的對外接口；