Come rilevare se il browser supporta il valore "solo testo" nel parametro contenteditable?

Question

Non riesco a trovare alcuna informazione pertinente sul parametro HTML5 "contenteditable". Ho scoperto che Google Plus sta usando questo per i browser Chrome:

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

Sembra che nessun altro browser supportano questo ed è solo Chrome valore di proprietà. Voglio usarlo nel mio progetto. Tuttavia, ho bisogno di rilevare il browser e scoprire se supporta l'impostazione "solo testo".

Naturalmente, ho potuto rilevare solo Chrome, ma potrebbero esserci altri browser che lo supportano (non ne conosco nessuno al momento) o altri browser di flusso principale potrebbero iniziare a supportare questa funzione in futuro.

Quindi vorrei piuttosto rilevare se la funzionalità "solo testo" è supportata rispetto al rilevamento solo del browser Chrome.

Chiunque può aiutarmi in questo?

Answer 1

Sembra una funzionalità webkit-only. L'spec consente solo "vero", "falso" e "ereditano" come valori possibili per l'attributo

Un bug è stata depositata per aggiungere il supporto per testo in chiaro per le specifiche di modifica, ma è divertente che la richiesta è per "plaintext "invece di" solo testo in chiaro ".

Modifica: Questo codice può essere utilizzato per rilevare il supporto. Demo:

function supportsPlainText() 
{ 
    var d = document.createElement("div"); 
    try { 
     d.contentEditable="PLAINtext-onLY"; 
    } catch(e) { 
     return false; 
    } 
    return d.contentEditable=="plaintext-only"; 
} 

alert(supportsPlainText()); 

Ma ricordate che facendo le pagine specifiche del browser è quello che ci ha guidato al problema IE6.

Answer 2

Ecco alternativa, se si preferisce non fare affidamento sulla cattura di eccezioni per rilevare caratteristiche:

function supportsPlaintextEditables() { 
    var div = document.createElement('div'); 
    div.setAttribute('contenteditable', 'PLAINTEXT-ONLY'); 

    return div.contentEditable === 'plaintext-only'; 
} 

console.log(supportsPlaintextEditables); 
//-> true/false 

Questo funziona perché l'impostazione del valore per l'attributo invece che la proprietà non sarà un'eccezione SyntaxError se 'plaintext-only' è un valore non valido, invece imposterà il valore della proprietà sul valore predefinito, 'inherit'.

Ottenere la struttura dopo aver impostato i risultati di attributo in una stringa in minuscolo, quindi impostare il valore dell'attributo 'PLAINTEXT-ONLY' si tradurrà in una proprietà con il valore 'plaintext-only' (supportato/true) o 'inherit' (non supportato/false).