मोबाइल डिवाइस पर ग्रंथों का चयन करते समय देशी व्यवहार को ओवरराइड करता है

Question

मैं जानना चाहता हूं कि मोबाइल ब्राउज़र पर ग्रंथों का चयन करते समय मूल व्यवहार को ओवरराइड करने का कोई तरीका है या नहीं। मैं अपनी खुद की एक्शन बार प्रदान करके आईफोन और एंड्रॉइड डिवाइस दोनों का समर्थन करने की कोशिश कर रहा हूं।

कोई सुझाव?

Answer 1

यद्यपि आप मूल कार्यक्षमता के साथ अपनी 'एक्शनबार' दिखाने के लिए selectionchange ईवेंट का उपयोग कर सकते हैं, यदि आप देशी व्यवहार को 'प्रतिस्थापित' करना चाहते हैं तो आपको स्क्रैच से पूरे चयन को नकली करने की आवश्यकता होगी या selectionchange का उपयोग करें घटना और दूसरी बार चयन को आप रंगीन अवधि तत्व के साथ चयनित पाठ को लपेटते हैं और वास्तविक चयन रद्द करते हैं (अपनी एक्शनबार दिखाते समय), इस विधि के साथ समस्या यह होगी कि 1) मूल एक्शनबार एक के लिए दिखा सकता है विभाजित दूसरा और 2) अनुभव खतरनाक प्रभाव होने के लिए उपयोगकर्ता का उपयोग करने से अलग होगा। यदि दूसरी तरफ आप स्क्रैच से चयन करना चाहते हैं तो आपको user-select सीएसएस प्रॉपर्टी का उपयोग टेक्स्ट चयन को अक्षम करने के लिए और टचस्टार्ट के आधार पर अगला आकृति आउट करना चाहिए और 'टेक्स्ट' (रंगीन स्पैन के साथ) टेक्स्ट (वास्तव में केवल संभव है) एक बेहद नियंत्रित वातावरण में (उदाहरण के लिए एक पाठ-पाठक पाठक आवेदन))।

कृपया ध्यान दें कि इस selectionchange घटना के रूप में फ़ायरफ़ॉक्स और ओपेरा में काम नहीं करेगा वहाँ निकाल दिया नहीं है और आप दस्तावेज़ में अन्य सभी touchend घटनाओं के उत्साह से भरा हुआ रोक ओपेरा मोबाइल और फ़ायरफ़ॉक्स का समर्थन करने के लिए + पर एक touchend ईवेंट हैंडलर का उपयोग करने की आवश्यकता होगी मोबाइल। (तथ्य यह है कि select काम नहीं करता है और selectionchange इस्तेमाल किया जाना चाहिए के लिए क्रेडिट टिम नीचे को जाता है)

Answer 2

संदर्भ:

jsFiddle Demo with Plugin

jsFiddle डेमो ऊपर मैंने एक प्लगइन का उपयोग करता है आप अनुमति देने के लिए को एंड्रॉयड में (भी डेस्कटॉप ब्राउज़र के साथ) चयनित होने या आईओएस उपकरणों से पाठ के किसी भी ब्लॉक को रोकने के।

यह आपके पास अन्य मार्कअप के साथ हस्तक्षेप नहीं कर सकता है, जैसे jQuery .click(); ईवेंट श्रोताओं jsFiddle में दिखाए गए अनुसार।

इसका उपयोग करना आसान है और jQuery प्लगइन स्थापित होने के बाद यहां नमूना मार्कअप है।

नमूना HTML:

<p class="notSelectable">This text is not selectable</p> 

<p> This text is selectable</p> 

नमूना jQuery:

$(document).ready(function(){ 

    $('.notSelectable').disableSelection(); 

}); 

पूरा jQuery प्लगइन:

$.fn.extend({ 
    disableSelection: function() { 
     this.each(function() { 
      this.onselectstart = function() { 
       return false; 
      }; 
      this.unselectable = "on"; 
      $(this).css('-moz-user-select', 'none'); 
      $(this).css('-webkit-user-select', 'none'); 
     }); 
    } 
}); 

Answer 3

यो तो आपका उद्देश्य चयन को रोकने के लिए है, आप

body 
{ 
    -moz-user-select: none; 
    -khtml-user-select: none; 
    -webkit-user-select: none; 
    user-select: none; 
}