Je veux empêcher une zone code> contentiable code> de la perte de mise au point si un clic est effectué à l'extérieur de cette zone. Un exemple d'échantillon HTML ressemble à ceci: échantillon JavaScript est comme suit: p> lorsque vous cliquez sur le En outre, la plage change au moment où l'événement de clic est tiré, je ne peux donc pas revenir à la plage précédente une fois le clic survenu. Y a-t-il un moyen de maintenir la position du curseur et de se concentrer après un clic sur un clic? P> jsfiddle: http://jsfiddle.net/vivekvish/fkdhe/4/ p> p> #clickthis < / Code> DIV ou n'importe où en dehors du
#Content code> div, vous perdez la mise au point sur le
#content code> SIV même si vous appelez la fonction
EventDefault CODE> . P>
3 Réponses :
Essayez d'ajouter Quoi qu'il en soit, êtes-vous sûr qu'il est une bonne idée de forcer l'utilisateur à ce domaine? :) p> $ ('# content'). Focus (); code> après
e.preventDefault (); code>
Ce n'est pas une solution parfaite, car elle saute au début, mais essayez-la. P>
Dans mon cas, oui. L'application complète est un éditeur WYSIWYG et lorsque l'utilisateur clique sur une barre d'outils mais manque un bouton, il doit cliquer sur la position du contenu qu'elles étaient auparavant, puis cliquez à nouveau sur le bouton de la barre d'outils. Le $ ('# Content'). Focus () Code> SUIT SUIT SUR cela. C'est-à-dire qu'ils devront cliquer pour revenir à leur position précédente. Merci pour l'idée.
Mettre la question de Juan dans une réponse, au lieu d'utiliser l'événement de clic, vous devez utiliser l'événement MOUSEDOWN comme suit:
$(document).ready(function() { $('#content')[0].contentEditable=true; $('#clickThis').bind('mousedown',function(e) { console.log(window.getSelection().getRangeAt(0).startContainer); e.preventDefault(); }); });
La Event.ProventDefault () code> au
MouseDown code> événement.
const button = document.getElementById('boldFormat')
button.addEventListener('mousedown', (event) => {
event.preventDefault() // prevent loss of focus
document.execCommand('bold', false)
})
Eh bien, je sais que cela est possible dans Jeditable, si vous préférez utiliser ce plugin, il vous donnerait également beaucoup plus de puissance AppelsIini.net/Projects/jeditable
Mes besoins sont super spécifiques. J'ai déjà construit un wysiwyg entier. Il serait difficile de revenir. Merci pour la suggestion cependant. Comment faites-vous précisément en jeditable? Si vous pouviez l'expliquer, je peux peut-être reproduire la fonctionnalité.
C'est une option que vous écririez, ONBLUR: Aucun, et merci de ne pas vous déchirer la tête pour offrir une solution différente au problème;)
Essayez l'événement MouseDown, peut-être que la gamme n'a pas changé à cet événement
Merci Juan. Cela a parfaitement fonctionné. Prévenir la valeur par défaut pour MouseDown l'a fait. S'il vous plaît faites votre commentaire une réponse afin que je puisse l'accepter. Et merci encore pour les idées, Mazzzzz. Je ne l'ai pas essayé. Peut-être ça marche toujours.