Comment puis-je conserver une sélection en surbrillance en utilisant Javascript?

Je souhaite mettre en évidence une sélection de texte sur une page Web. Je suis passé par this solution suggéré par Tim Down qui fait la moitié du travail pour moi.Comment puis-je conserver une sélection en surbrillance en utilisant Javascript?

Maintenant, j'ai besoin d'un moyen de mettre en évidence le texte de façon permanente. En permanence, je veux dire quand je surligne du texte, fermez le navigateur puis rouvrez la page depuis le local, le texte doit rester en surbrillance. La solution de Tim garde le texte en surbrillance tant que je ne rafraîchis pas ou ne ferme pas la page. Je suppose que j'ai besoin de sauvegarder le début et la fin de la plage quelque part pour que la prochaine fois que je rouvre la page, je puisse à nouveau mettre en évidence toutes les plages. Désolé, j'ai oublié de mentionner que je travaille sur iPhone afin que je puisse garder un tableau de sélections sur local pour une page spécifique. Toute solution pour stocker une plage pour la sélection qui peut être imbriquée ou sur plusieurs éléments (par exemple div/p/span)?

Source

2010-08-31 Farhan

trouvé un moyen de stocker la gamme http://home.arcor.de/martin.honnen/javascript/storingSelection1.html – Farhan

Vous avez besoin de deux choses: certains moyens de sérialiser la sélection et certains moyens de la sauver. Cookies et/ou le stockage local ferait pour la partie de sauvegarde. Pour la sérialisation/désérialisation, je suggère de créer une sorte de chemin à travers le DOM en utilisant l'index de nœud enfant à chaque niveau pour spécifier les limites de sélection. Voir cette réponse à une question similaire: Calculating text selection offsets in nest elements in Javascript

Edit: résumé de la solution liée

sélection de l'utilisateur peut être exprimé sous la forme d'un objet Range. Une plage a une limite de début et de fin, exprimée chacune en termes de décalage dans un noeud. La réponse à laquelle je suis lié suggère de sérialiser chaque frontière comme un chemin à travers le DOM qui représente le nœud, couplé avec le décalage. Par exemple, pour le document suivant avec les limites de la sélection représentée par |:

<html><head><title>Foo</title></head><body>On|e <b>t|wo</b><div>

... vous pouvez représenter la sélection départ limite comme "1/0:2", sens de décalage 2 dans le nœud enfant à la position 0 du nœud enfant position 1 dans la racine du document. De même, la limite d'extrémité serait "1/1/0:1". Vous pouvez représenter l'ensemble JSON comme '{"start":"1/0:2",end:"1/1/0:1"}'.

Source

2010-08-31 09:37:42

je n'ai pas eu ce qu'il fait.Je peux avoir div, span, p, tout tag valide.est-il un moyen d'extraire les informations de la gamme tout en sélectionnant.J'aime votre solution de mise en évidence et que vous voulez l'étendre à mon problème.une solution pour cela? – Farhan

Mis à jour ma réponse. –

trouvé un moyen de stocker la gamme sur ce lien. http://home.arcor.de/martin.honnen/javascript/storingSelection1.html – Farhan

Une option pour enregistrer les données localement serait d'utiliser des cookies: http://www.w3schools.com/js/js_cookies.asp

ou HTML5 localStorage: http://people.w3.org/mike/localstorage.html

Mais l'inconvénient évident est qu'il est lié au navigateur actuel et l'ordinateur. Si vous voulez quelque chose de plus persistant, vous voudrez utiliser une sorte d'aide côté serveur. Quelles sont vos exigences?

je suppose que vous pourriez économiser début et positions de fin, puis à la charge de la page recréent la gamme en utilisant document.createRange et les méthodes setStart et setEnd

https://developer.mozilla.org/en/DOM/document.createRange https://developer.mozilla.org/en/DOM/range.setStart

Source

2010-08-31 09:16:20 sewa

Voici une découverte précieuse: MASHA (abréviation de Mark & Partager) est un utilitaire JavaScript vous permettant de marquer des parties intéressantes de contenu de la page web et de le partager http://mashajs.com/

Il est également sur GitHub https://github.com/SmartTeleMax/MaSha

Fonctionne même sur Mobile Safari et IE

Source

2012-07-06 15:34:00 yumyo

Comment ne faites-vous pas étendre la sélection aux mots? (être capable de sélectionner quelques mots dans un mot, par exemple) –

Rangy est une très belle bibliothèque de sélection et de sélection de plusieurs navigateurs écrits par Tim Down depuis qu'il a écrit sa réponse à thi s question. Son Serializer module enveloppe le type de sélecteur que Tim a décrit (par exemple "0/1/2: 34") et ajoute quelques fonctions auxiliaires pour conserver le résultat à un cookie. Vous pouvez facilement ignorer les fonctions d'assistance et persister ailleurs, telles que le stockage local ou un service Web.

Dans l'ensemble, c'est une excellente solution au problème de la persistance d'une sélection à travers des sessions de navigateur.

Source

2012-10-09 11:45:04

Comment puis-je conserver une sélection en surbrillance en utilisant Javascript?

Répondre

Questions connexes