J'ai des difficultés à utiliser contentieux dans Firefox 3. J'ai un problème dans lequel le curseur apparaîtra au-dessus ou uniquement partiellement dans la DIV après que je clique dessus (jusqu'à ce que je commence à taper à quel moment il se comporte correctement). Des idées sur la façon dont je peux arrêter cela de se produire?
html: 
6 Réponses :
Vous devez mettre une sorte de contenu ou de HTML entre la DIV que vous souhaitez modifier:
<div id="input" style="width:100%; height:100%; border:1px solid black; outline:none" contentEditable="true">Some sort of content or HTML here.</div>
Merci. Il semble donc que simplement mettre un espace entre les balises de début et de fin rend la div éditable. Cependant, j'ai alors le problème que j'ai décrit où le curseur apparaît au-dessus / à l'extérieur de la DIV. Des idées sur la façon dont je peux traiter avec ça?
Il semble que cette partie soit un bug. Le même problème se produit sur cette démo Valums.com/wp -Content / Uploads / 2009/10 / EdittableText / Demo / ...
Je branche mon cerveau pendant des heures d'essayer de trouver un moyen de pirater cela. Ce que je suis venu, c'était d'envelopper l'éditeur d'un divisé qui est caché par défaut. Ensuite, utilisez un peu de JavaScript en ligne pour afficher la DIV. Cela semble rendre le curseur sauter dans la bonne position. Son sale, mais ça marche!
J'ai attendu et utilisé le contenu modifiable uniquement dans Firefox 4 et plus. J'ai déposé cela et quelques autres bugs que l'équipe Mozilla a fixé pour FF 4.
qui peut être résolu en créant aveugle DIV et y ajouter de l'accent, alors votre navigateur n'est pas axé sur l'élément contenthitable, mais l'utilisateur doit cliquer dessus et ce cas indique le curseur au bon endroit.
$(document).ready(function(){
$("#target_blind").focus();
});
<div id="target_blind" style="display:none;"></div>
<div id="target" contenteditable="true"></div>
J'ai également rencontré ce problème dans la dernière version de FF 22. Dans mon cas, mon éditeur de Div Outer Div (E.G. "Comme ci-dessus) n'avait pas de hauteur et que ma position du curseur était inférieure à la DIV contentiable. En fournissant une hauteur à l'extérieur, par exemple hauteur: 1.5em; , le curseur se positionne correctement.
J'ai le même problème avec Firefox 37.0.2. Mettre un espace zéro de largeur dans le contentimé: Avant que Pseudo Element fixe le problème:
.contenteditable:empty:before {
content: "\200B";
display: inline;
}
Cela a provoqué une ligne vierge ajoutée sur le dessus du .Contentritable -Container lorsque vous avez appuyé sur Entrée dans IE11 pour moi. Cela peut également être corrigé en appliquant également le : vide -PSeeudoSelector sur .Contentidithitable .
Dupliqué possible de Firefox définit la mauvaise position du caret contentiable avec: avant