"span" तत्वों का उपयोग कर एक कस्टम वेब-आधारित टेक्स्ट एडिटर बनाना - एक बुरा विचार?

Question

मैं एक वेब अनुप्रयोग है जिसके लिए मैं एम्बेडेड पाठ संपादक और पाठ संपादक की कार्यक्षमता पर पूरा नियंत्रण की आवश्यकता होगी के लिए एक विचार बिल्कुल सभी ब्राउज़र में समान रूप से कार्य करना चाहिए। इस अवसर पर मानक contenteditable कार्यक्षमता मेरी आवश्यकताओं के लिए पर्याप्त नहीं है।

तो मैं एक कस्टम पाठ संपादक को लागू करने के विभिन्न तरीकों के साथ प्रयोग किया गया है। मेरा पहला दृष्टिकोण कैरेट सम्मिलन के लिए माउस क्लिक का पता लगाने के लिए था (हालांकि कोई दृश्यमान देखभाल नहीं है क्योंकि यह प्राप्त करने का कोई तरीका नहीं दिखता है)। यह बल्कि अच्छी तरह से काम किया, लेकिन दुर्भाग्य से देखभाल (उर्फ चमकती आई-बीम) प्रदर्शित करने का कोई तरीका नहीं था।

इसका मतलब यह है कि मेरी चमकती कैरट भी कस्टम किया जाना चाहिए। मैं केवल इस तरह से हासिल करने के दो अच्छे तरीकों के बारे में सोच सकता हूं जो सभी ब्राउज़रों में संगत होगा।

1. पहला (और शायद बेहतर) विकल्प जावास्क्रिप्ट में कस्टम लेआउट इंजन को लागू करना होगा जैसे कि Google ने Google डॉक्स के साथ किया है।

2. दूसरा समाधान (शायद बहुत आसान) अपने स्वयं के <span> तत्व अंदर का प्रत्येक वर्ण को संपुटित करने के लिए और इस तरह की इजाजत दी अशुद्ध कैरट विशिष्ट वर्णों के बीच रखा जाना होगा। इसका मतलब यह है कि बहुत सारे तत्व तत्व होंगे, लेकिन ब्राउजर लेआउट इंजन का लाभ उठाते समय मुझे यह निश्चित रूप से हासिल करना होगा। इस दृष्टिकोण के साथ एक अन्य लाभ यह है कि मुझे डोडी ब्राउज़र-विशिष्ट टेक्स्ट चयन हैक्स पर भरोसा करने की आवश्यकता नहीं है।

तो मेरा प्रश्न, विकल्प # 2 वास्तव में एक बुरा विचार है? यदि हां, तो क्यों?

Answer 1

सबसे पहले - क्या तुम सच में अपने स्वयं के संपादक पर काम करने की जरूरत है? वहाँ Firepad और Etherpad उनके बहुत अच्छा सहयोगी संपादन और शायद अधिक खुला स्रोत संपादकों पर contenteditable आधारित नहीं के साथ कर रहे हैं। ऐसे संपादक को बनाना वाकई मुश्किल है, इसलिए इस पर समय बर्बाद करने का अर्थ नहीं है।

हालांकि, यदि आप वास्तव में अपने स्वयं के समाधान पर काम करना चाहते हैं और आपको बिल्कुल सभी ब्राउज़रों में एक ही व्यवहार की आवश्यकता है, तो आप बर्बाद हो गए हैं;)। भले ही आप contenteditable से बचें, निश्चित रूप से अन्य चीजें हैं जो गलत हो सकती हैं।

वैसे भी, इस सवाल का जवाब:

1. पहले विकल्प बहुत मुश्किल और समय शुरुआत में लगता है, लेकिन यह आप एक दूसरे के तुलना में बहुत अधिक शक्ति देता है। जैसे पूरी तरह से कस्टम लेआउट इंजन होने के लिए, आप (क्योंकि आप चाहते हैं बिल्कुल सभी ब्राउज़र में समान व्यवहार, जिस पर आप पर कभी नहीं भरोसा कर सकता जाएगा) CSS3 के कार्यान्वयन का इंतजार किए बिना पृष्ठ विराम लागू करने में सक्षम हो जाएगा। और वास्तव में, आप अधिकांश ब्राउज़रों के प्रतिपादन मतभेदों को बाईपास करने में सक्षम होंगे। लेकिन, जब तक आपको सभ्य जेएस देवों और कुछ महीनों (कम से कम) की टीम नहीं मिल जाती, तब तक मैं इसके बारे में सोचना भी शुरू नहीं करता।

2. दूसरा समाधान - डीओएम का पुन: उपयोग करना अधिक यथार्थवादी है। मैं पहले कुछ प्रदर्शन परीक्षण करता हूं, लेकिन प्रति चरित्र अवधि होने पर यह पता लगाना आसान होगा कि माउस क्लिक के बाद कैरेट रखा जाना चाहिए। इसके बिना इसे कुछ चाल की आवश्यकता है ... जो मुझे नहीं पता।आप यह जांचने का प्रयास कर सकते हैं कि ईथरपैड और फायरपैड (जो Ace code editor का उपयोग करता है) इसके साथ सौदा करते हैं, लेकिन फिर भी - रैपिंग सबसे आसान विकल्प होगा और कम से कम सभ्य ब्राउज़र पर इसे प्रदर्शन समस्याओं का कारण नहीं बनना चाहिए, जब तक कि आप वास्तव में लंबे दस्तावेज़ों को संपादित नहीं करना चाहते हैं (लेकिन तो आप कुछ अनुकूलन शुरू कर सकते हैं)।