2010-06-21 14 views
5

J'essaie d'utiliser contenteditable et styleWithCss.webkit stylewithcss contenteditable ne fonctionne pas?

Il ne semble pas fonctionner dans webkit.

Chaque fois que j'utilise une commande execCommand, elle génère un <b> au lieu de l'intervalle prévu.

Voici une démo: http://jsbin.com/izomo/2/edit

partie Sélectionnez du texte, cliquez sur le bouton gras, et voir la sortie html.

Est-ce un bug ou est-ce que je fais quelque chose de mal?

Merci beaucoup.

Répondre

2

Il semble que tout fonctionne comme prévu. Voir Bug 13490 sur WebKit BugZilla.

EDIT: Support pour styleWithCSS a été ajouté à la source de WebKit dans changeset 40560, le 03 Février 2009.

Cela dit, il semble que depuis lors, peu importe quoi, styleWithCSS est toujours à false, alors que Avant le changement, les commandes de style étaient toujours appliquées avec CSS, comme si styleWithCSS existait mais était toujours définie sur true.

J'ai même essayé de réécrire votre ligne document.execCommand comme suit, conformément à la Mozilla documentation:

document.execCommand("styleWithCSS", true, null); 
document.execCommand("bold", false, null); 

Ces commandes modifiées fonctionnent toujours dans Firefox, mais pas dans les deux Chrome 5 ou Safari 5 (à la fois sur Windows et installé aujourd'hui). Donc, il semblerait que ce soit un bug WebKit.

+0

C'est pour stylewithcss faux, je suis en train de faire stylewithcss vrai. – Mark

+0

D'oh! D'accord. Je vais faire un plongeon. –

+0

Même bug que l'original, mais maintenant dans la direction opposée? J'ai mis à jour ma réponse après quelques recherches supplémentaires.Je pense que l'ajout du support 'styleWithCSS' était supposé le rendre configurable, mais il est bloqué dans son état par défaut, qui est' false'. (Voir [Editor.cpp: 940] (http://trac.webkit.org/browser/trunk/WebCore/editing/Editor.cpp?rev=61418#L940).) –

1
document.execCommand("styleWithCSS", true, null); 
document.execCommand("bold", false, null); 
10

Je n'ai pas réussi à obtenir ceci pour travailler avec les commandes dans les deux réponses ici. Pour ceux qui se battent encore la tête avec la question, voici comment le faire fonctionner.

Nous pouvons passer trois valeurs à ExecCommand

document.execCommand(command, uiElement, value) 

Comme l'excellent Christopher réponse détaille la valeur de "styleWithCSS" est à false par défaut juste essayer:

alert(document.queryCommandState("styleWithCss")); 

Pour régler l' vrai, vous devez passer le troisième argument, "valeur" comme vrai. Comme ceci:

document.execCommand("styleWithCSS", null, true); 

Cela fonctionne dans Firefox et Chrome