Textarea कि मक्खी पर वाक्य रचना हाइलाइटिंग कर सकते हैं?


203

मैं आसान रखरखाव के कारणों के लिए एक सीएमएस के अंदर कई HTML ब्लॉकों को संग्रहीत कर रहा हूं। उनका प्रतिनिधित्व <textarea>एस।

क्या कोई किसी प्रकार का एक जावास्क्रिप्ट विजेट जानता है जो HTML के लिए एक textareaसमान या एक समान पाठ संपादक (कोई WYSIWYG या उन्नत फ़ंक्शन) रहते हुए सिंटैक्स हाइलाइटिंग कर सकता है ?


1
क्या यह संभव है कि डब्ल्यू 3 सी textareaएचटीएमएल स्पेसिफिकेशन और संबंधित मानकों के भविष्य के संस्करण में अधिक बहुमुखी और एक्स्टेंसिबल बना सके ?
जेम्स हाई

3
@ FabienMénager आपके डुप्लिकेट लिंक को हटा दिया गया है।
पैट्रिक रॉबर्ट्स

3
यह मदद करेगा codepen.io/kazzkiq/pen/xGXaKR
Shan

जवाबों:


217

नियमित रूप से एक textarea में प्रस्तुति पर नियंत्रण के आवश्यक स्तर को प्राप्त करना संभव नहीं है।

यदि आप इसके साथ ठीक हैं, तो CodeMirror या Ace (पूर्व में स्काईराइटर और bespin ) , या मोनाको (MS VSCode में प्रयुक्त) आज़माएँ।

डुप्लिकेट थ्रेड से - एक अनिवार्य विकिपीडिया लिंक: http://en.wikipedia.org/wiki/Comparison_of_JavaScript-based_source_code_editors


3
असल में, Bespin स्क्रीन पाठकों के लिए समर्थन जोड़ने के लिए एक नियमित टेक्सारिया कमबैक का उपयोग करता है (इसलिए अक्षम लोग आसानी से इसका भी उपयोग कर सकते हैं)।
एली ग्रे

2
CodeMirror बिल्कुल वैसा ही दिखता है जैसा मुझे चाहिए। जब तक यह एक textarea की तरह व्यवहार करता है, मैं इसे एक नहीं होने के साथ सहज हूं।
पेका

1
आपको जवाब के लिए धन्यवाद। आपकी प्रतिक्रिया और इसके बारे में मेरे दिमाग को उड़ाने के बाद यह मिला! :) github.com/securingsincity/react-ace
Casey

27

यहाँ मैं एक समान सवाल ( ऑनलाइन कोड संपादक ) प्रोग्रामर पर की गई प्रतिक्रिया है :

सबसे पहले, आप इस लेख पर नज़र डाल सकते हैं:
विकिपीडिया - जावास्क्रिप्ट-आधारित स्रोत कोड संपादकों की तुलना

अधिक के लिए, यहां कुछ उपकरण दिए गए हैं जो आपके अनुरोध के साथ फिट होते हैं:

  • EditArea - FileEditor के रूप में डेमो जो एक Yii एक्सटेंशन है - ( Apache Software लाइसेंस, BSD, LGPL )

    यहाँ EditArea, स्रोत कोड के लिए एक मुफ्त जावास्क्रिप्ट संपादक है। यह लाइन न्यूमेरोटेशन, टैब सपोर्ट, सर्च एंड रिप्लेसमेंट (रेगेक्सप के साथ) और लाइव सिंटैक्स हाइलाइटिंग (अनुकूलन) के साथ अच्छी तरह से फॉर्मेटेड सोर्स कोड लिखने की अनुमति देता है।

  • कोडप्रेस - जूमला का डेमो! कोडप्रेस प्लगइन - ( एलजीपीएल ) - यह क्रोम में काम नहीं करता है और ऐसा लगता है कि विकास बंद हो गया है।

    कोडप्रेस वेब-आधारित स्रोत कोड संपादक है, जो जावास्क्रिप्ट में लिखे गए सिंटेक्स हाइलाइटिंग के साथ है जो कि ब्राउज़र में टाइप किए जाने के दौरान वास्तविक समय में टेक्स्ट को रंग देता है।

  • CodeMirror - कई डेमो में से एक - ( एमआईटी-शैली लाइसेंस + वैकल्पिक वाणिज्यिक समर्थन )

    CodeMirror एक जावास्क्रिप्ट लाइब्रेरी है जिसका उपयोग कोड जैसी सामग्री के लिए अपेक्षाकृत सुखद संपादक इंटरफ़ेस बनाने के लिए किया जा सकता है - कंप्यूटर प्रोग्राम, HTML मार्कअप और इसी तरह। यदि आपके द्वारा संपादित की जा रही भाषा के लिए एक मोड लिखा गया है, तो कोड रंगीन हो जाएगा, और संपादक वैकल्पिक रूप से आपको इंडेंटेशन में मदद करेगा

  • Ace Ajax.org Cloud9 संपादक - डेमो - ( मोज़िला त्रि-लाइसेंस (MPL / GPL / LGPL) )

    ऐस जावास्क्रिप्ट में लिखा गया एक स्टैंडअलोन कोड संपादक है। हमारा लक्ष्य एक वेब आधारित कोड संपादक बनाना है, जो मौजूदा मूल संपादकों जैसे कि TextMate, Vim या Eclipse के फीचर्स, प्रयोज्यता और प्रदर्शन से मेल खाता है। इसे आसानी से किसी भी वेब पेज और जावास्क्रिप्ट एप्लिकेशन में एम्बेड किया जा सकता है। ऐस को क्लाउड 9 आईडीई के लिए प्राथमिक संपादक और मोज़िला स्काईराईटर (बेस्पिन) प्रोजेक्ट के उत्तराधिकारी के रूप में विकसित किया गया है ।


1
ओह, यह पूरी तरह से निराशाजनक है ... एक 100 परियोजनाएं जो यह करने वाली हैं, और पूरी तरह से कोई भी काम नहीं करता है।
रोबिनज

ऐस संपादक का लाइसेंस बदलकर BSD github.com/ajaxorg/ace/blob/master/LICENSE
S.Krishna



7

अपडेट: बेस्पिन अब एसीई है, जिसका उल्लेख यहां सबसे अधिक मूल्यांकित उत्तर द्वारा किया गया है। इसकी जगह ACE का इस्तेमाल करें।

गोटिया मोज़िला द्वारा बेस्पिन के साथ चलते हैं । यह एचटीएमएल 5 सुविधाओं का उपयोग करके बनाया गया है (इसलिए यह त्वरित और तेज़ है, लेकिन विरासत ब्राउज़र का समर्थन नहीं करता है), लेकिन निश्चित रूप से उपयोग करने के लिए अद्भुत है और जो कुछ भी मैं भर में आया हूं उसे धड़कता हूं - शायद यह मोज़िला इसे समर्थन कर रहा है, और वे फ़ायरफ़ॉक्स को विकसित करते हैं। .. इसमें एक jQuery प्लगिन भी है, जो इसे jQuery के साथ उपयोग करने के लिए थोड़ा आसान बनाने के लिए इसका विस्तार करता है।



2

एकमात्र संपादक जिसके बारे में मुझे पता है उसमें वाक्य रचना हाइलाइटिंग है और एक textarea के लिए एक वापसी मोज़िला बेस्पिन है । Bespin को एम्बेड करने के लिए Google आसपास यह देखने के लिए कि संपादक को कैसे एम्बेड किया जाए। एकमात्र साइट जिसके बारे में मुझे पता है कि यह अभी उपयोग करता है बहुत अल्फा मोज़िला जेटपैक गैलरी (सबमिट जेटपैक पेज में) है और आप यह देखना चाहते हैं कि वे इसे कैसे शामिल करते हैं।

Bespin संपादक को एम्बेड करने और पुन: उपयोग करने पर एक ब्लॉग पोस्ट भी है जो आपकी मदद कर सकती है।


ऐस मोज़िला बेस्पिन परियोजना का उत्तराधिकारी है।
Zachary Keener

1

आप उन्हें टेक्स्टारिस के रूप में क्यों प्रतिनिधित्व कर रहे हैं? यह मेरा पसंदीदा है:

http://alexgorbatchev.com/wiki/SyntaxHighlighter

लेकिन अगर आप CMS का उपयोग कर रहे हैं, तो शायद बेहतर प्लगइन है। उदाहरण के लिए, वर्डप्रेस का एक विकसित संस्करण है:

http://www.viper007bond.com/wordpress-plugins/syntaxhighlighter/


15
ये प्लग-इन एक
टेक्स्टारिया की

1
लिंक टूट गया है।
नकल
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.