jak wyłączyć elementy w contenteditable div?

Question

Mężczyzna Mam div z atrybutem contentEditable na true!

Zrobiłem to, ponieważ chciałem, aby zachowywał się jak tekst, który zmienia swój wzrost zgodnie z tekstem! Działa Idealne

Ale kiedy skopiować hiperłącze i wklej go w moim div zamiast zwykłego tekstu mieć elementu zaczepienia ... To samo z drugiej jeśli wybiorę jakąś część każdej strony i wkleić go w tym contenteditable div pokazuje cały HTML. Chcę, aby ten element wyświetlał tylko zwykły tekst i wyłączał wszystkie elementy w nim zawarte!

robocza Fiddle: http://jsfiddle.net/4ctVx/

Wystarczy skopiować dowolny kod HTML w nim i będzie to również pokazać youdiv z tym HTML. Chcę, aby to zostało wyłączone, a div aby pokazać tylko zwykły tekst!

Answer 1

Po dodaniu detektora zdarzeń do edytowalnej zawartości div można użyć jQuery, aby zamienić RichText na PlainText. Złapałem słuchacza zdarzeń od balupton tutaj: 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'); 
});​