2017-11-09 20 views
7

मेरे पास एक ऐसा एप्लीकेशन है जहां एक एसवीजी तत्व के अंदर तत्व ड्रैग और गिराए जा सकते हैं (d3-drag और d3-zoom पर धन्यवाद, https://bl.ocks.org/mbostock/3127661b6f13f9316be745e77fdfb084 ऐसे पृष्ठ के लिए उदाहरण के रूप में देखें) जिसे स्पर्श-सक्षम डिवाइस पर भी उपयोग किया जा सकता है लेकिन क्या होता है एक लंबे प्रेस के बाद एक संदर्भ मेनू पॉप अप (कम से कम आईई 11, एज और फ़ायरफ़ॉक्स में) और रास्ते में है, इसलिए मैं संदर्भ मेनू को इस मामले में दिखने से रोकना चाहता हूं।संदर्भमेनू घटनाओं को छोड़ दें जो स्पर्श कार्रवाई का परिणाम हैं?

मैं केवल contextmenu ईवेंट को संभालने और ईवेंट ऑब्जेक्ट पर .preventDefault() को संभालने से सामान्य रूप से संदर्भ मेनू दिखाने की अनुमति नहीं दे सकता लेकिन मुझे आश्चर्य है कि समाधान मौजूद है या नहीं, जहां संदर्भ मेनू को टच केस में दिखने से अवरुद्ध किया गया है और यह अभी भी उदाहरण के लिए दिखाओ राइट-क्लिक या जब menu key दबाया जाता है जबकि तत्व फोकस करता है।

मैंने सोचा था कि पहले मैं घटना वस्तु की .button और .buttons संपत्तियों पर दिखाई दे सकता है पर लेकिन ऐसा लगता है जैसे उन मूल्यों को मनमाने ढंग से 0 या 2 कर रहे हैं और ऐसा लगता है कि यह किसी भी संयोजन में पाया जा सकता है जब विभिन्न पर विभिन्न ब्राउज़रों में परीक्षण सिस्टम।

तत्व पहले से ही touch-action: none है।

क्या संदर्भ मेनू बनाने के लिए कुछ काम करने का तरीका सिर्फ स्पर्श-प्रेस के परिणाम को प्रदर्शित नहीं करता है?

It looks like .preventDefault() on the relevant touch events wouldn't be an option.

+0

मुझे लगता है कि आप स्पर्श कार्यों बदल सकता है पीठ पर और चाहे या नहीं ContextMenu खोलने के लिए निर्धारित करने के लिए 'touchmove' और' touchend' घटनाओं का उपयोग करें। उदाहरण के लिए: 'टचमोव' पर आप एक झंडा सेट कर सकते हैं जो लंबे समय तक दबाए जाने पर अनदेखा किया जाना चाहिए। फिर 'टचेंड' पर आप ध्वज बंद कर सकते हैं। 'contextmenu 'ईवेंट हैंडलर में बस ध्वज की जांच करें। क्या इसका कोई मतलब है? – Potter

+0

@ पोटर वादा करता है लेकिन मुझे इसे विस्तार से देखना होगा, उदा। चाहे कोई दौड़ की स्थिति न हो, उदा। चाहे 'contextmenu' घटना वास्तव में केवल सभी ब्राउज़रों और प्लेटफ़ॉर्म पर प्रासंगिक स्पर्श ईवेंट के बाद ट्रिगर हो। मैंने अभी सीखा है कि माउस मामले में भी अंतर हैं जहां कुछ प्रणालियों पर यह सही माउस बटन का प्रेस होता है जो संदर्भ मेनू को ट्रिगर करता है जबकि दूसरों को यह रिलीज़ होता है। – phk

+0

@ पोटर भी, सैद्धांतिक रूप से मैं उन उपयोगकर्ताओं से निपट सकता हूं जो परिवर्तनीय हैं और इसलिए चीजों को मिलाकर मुझे लगता है कि उस तरह का एक बढ़िया मामला है कि चिंता करने योग्य नहीं है। मुझे लगता है कि शायद सभी 'contextmenu' घटनाओं को रोकने से पहले इतना बुरा नहीं है, आपका औसत उपयोगकर्ता इसका अधिक उपयोग नहीं कर रहा है और यदि केवल उन लिंक पर जिनके लिए मुझे लगता है कि मैं इसे फिर से अनुमति दे सकता हूं। क्या खो जाता है उदा। एज में आप एक एसवीजी (यहां तक ​​कि गतिशील रूप से जेनरेट किए गए) पर राइट-क्लिक कर सकते हैं और इसे डाउनलोड कर सकते हैं लेकिन मेरे मामले में यह किसी भी तरह से टूट गया है (सीएसएस और एक्सटी रेफरी के कारण)। – phk

उत्तर

2

jQuery यूआई टच पंच सिर्फ यह सब हल करती है।

यह jQuery UI के लिए एक टच इवेंट समर्थन है। असल में, यह सिर्फ jQuery UI पर स्पर्श ईवेंट को तार देता है। आईपैड, आईफोन, एंड्रॉइड और अन्य टच-सक्षम मोबाइल डिवाइस पर परीक्षण किया गया। मैंने jQuery यूआई सॉर्ट करने योग्य का उपयोग किया और यह एक आकर्षण की तरह काम करता है।

http://touchpunch.furf.com/

+0

मेरे मामले में 'd3' पहले से ही मेरे लिए सभी टच इवेंट हैंडलिंग कर रहा है इसलिए मुझे दूसरी लाइब्रेरी नहीं चाहिए। मैं एक निम्न स्तरीय समाधान की तलाश में हूं। – phk

+0

कूल तो क्या आप मुझे अपना कोड –

+0

देख सकते हैं यदि यह https://bl.ocks.org/mbostock/3127661b6f13f9316be745e77fdfb084 (सभी ब्राउज़र/ओएस संयोजनों में) पर काम करेगा तो यह शायद मेरे आवेदन में भी काम करेगा। – phk

संबंधित मुद्दे