एचटीएमएल 5 संतोषजनक div केवल सादे टेक्स्ट

Question

स्वीकार करता है मैं HTML5 संतोषजनक div बनाने की कोशिश कर रहा हूं, जो केवल एक सादा पाठ स्वीकार करता है। मैं एचटीएमएल और jQuery उपयोग कर रहा हूँ नीचे:

एचटीएमएल

<div contenteditable="true"></div> 

jQuery

(function() { 
    $('[contenteditable]').on('paste', function (e) { 
    e.preventDefault(); 
    var text = null; 
    text = (e.originalEvent || e).clipboardData.getData('text/plain') || prompt('Paste Your Text Here'); 
    document.execCommand("insertText", false, text); 
    }); 
}); 

लेकिन यह सभी ब्राउज़रों के लिए काम नहीं कर रहा। getData इंटरनेट एक्सप्लोरर ब्राउज़र में समर्थन नहीं करता है। मैंने स्टैक ओवरफ्लो पर यहां कई समाधानों का उल्लेख करने की कोशिश की, लेकिन मेरे लिए कोई भी काम नहीं किया।

मैं भी

(function() { 
    $('[contenteditable]').on('paste', function (e) { 
    e.preventDefault(); 
    var text = null; 

    if (window.clipboardData && clipboardData.setData) { 
     text = window.clipboardData.getData('text'); 
    } else { 
     text = (e.originalEvent || e).clipboardData.getData('text/plain') || prompt('Paste Your Text Here'); 
    } 
    document.execCommand("insertText", false, text); 
    }); 
}); 

की कोशिश की लेकिन यह मामला document.execCommand("insertText", false, text); में IE के लिए काम नहीं कर रहा।

फिल्टर एचटीएमएल टैग के बाद डेटा स्वीकार करना संभव बनाने का कोई तरीका है, ताकि कोई भी टाइप, पेस्ट, ड्रॉप या किसी अन्य तरीके से संपादन योग्य div में डेटा दर्ज कर सके। इसे इसे पाठ के रूप में प्रदर्शित करना चाहिए।

Answer 1

jQuery का बड़ा प्रशंसक नहीं होने के नाते, मेरा समाधान इसका कोई उपयोग नहीं करेगा। वैसे भी यहाँ यह जाता है (यह वैसे भी शुद्ध जावास्क्रिप्ट के रूप में, काम करना चाहिए):

function convertToPlaintext() { 
 
    var textContent = this.textContent; 
 
    this.innerHTML = ""; 
 
    this.textContent = textContent; 
 
} 
 

 
var contentEditableNodes = document.querySelectorAll('[contenteditable]'); 
 

 
[].forEach.call(contentEditableNodes, function(div) { 
 
    div.addEventListener("input", convertToPlaintext, false); 
 
});

Answer 2

इस प्रयास करें:

<div contenteditable="plaintext-only"></div> 

संदर्भ: इस अवधारणा का उपयोग करने में https://w3c.github.io/editing/contentEditable.html#h-contenteditable