सामग्री योग्य div में तत्वों को कैसे अक्षम करें?

Question

मैन मेरे पास contentEditable की विशेषता के साथ एक div है!

मैंने इसे बनाया क्योंकि मैं चाहता था कि यह एक टेक्स्टरीए जैसा कार्य करे जो इसकी ऊंचाई के अनुसार अपनी ऊंचाई बदलता है! काम करता है बिल्कुल सही

लेकिन जब मैं बजाय एक हाइपरलिंक कॉपी और सादा पाठ यह एंकर तत्व है ... दूसरे के साथ एक ही जा रहा है की मेरी div में पेस्ट अगर मैं किसी भी वेबसाइट के कुछ हिस्से का चयन करें और है कि contenteditable div में पेस्ट यह सभी एचटीएमएल दिखाता है। मैं चाहता हूं कि div केवल सादा पाठ दिखाए और इसमें सभी तत्वों को अक्षम कर दे!

कार्य फिडल: http://jsfiddle.net/4ctVx/

बस इसे में किसी भी HTML कॉपी और यह भी कि HTML के साथ youdiv दिखाएगा। मैं चाहता हूं कि इसे अक्षम किया जाए और div को केवल सादा पाठ दिखाने के लिए!

Answer 1

यदि आप संपादन योग्य सामग्री div में कोई ईवेंट श्रोता जोड़ते हैं, तो आप PlainText के साथ RichText को प्रतिस्थापित करने के लिए jQuery का उपयोग कर सकते हैं। मैंने इवेंट श्रोता को balupton से यहां छीन लिया: https://stackoverflow.com/a/6263537/1887483।

$('[contenteditable]').live('focus', function() { 
    var $this = $(this); 
    $this.data('before', $this.html()); 
    return $this; 
}).live('blur keyup paste', function() { 
    var $this = $(this); 
    if ($this.data('before') !== $this.html()) { 
     $this.data('before', $this.html()); 
     $this.trigger('change'); 
    } 
    return $this; 
}); 
//use this jQuery snippet to swap HTML for Text. 
$('.editableContent').live('change', function() { 
    $(this).html($(this).text()); 
    alert('changed'); 
});​