Dans un formulaire, remplacer l’apostrophe dactylographique par l’apostrophe typographique

Nouveau WRInaute
Bonjour,
J’ai mis en ligne un site d’exercices interactifs conçus avec HotPotatoes.
La page html contient un formulaire que le visiteur remplit (la « question ») tandis qu’un bouton « Correction » valide (ou non) la réponse encodée (sur base d’une ou plusieurs solutions répertoriées). Si la réponse est validée, elle s’affiche alors. S’il y a plusieurs solutions répertoriées, la réponse s’affiche comme elle a été encodée.
Fonctionnement parfait.
Seul problème : dans un formulaire, le clavier envoie une apostrophe droite [ ' ] (\u0027). C’est donc la réponse répertoriée. Même si les solutions répertoriées incluent l’occurrence avec l’apostrophe typographique [ ’ ](\u2019), à moins que le visiteur ne l’encode d’une façon ou d’une autre avec le clavier, c’est l’apostrophe dactylographique qui sera affichée.
La solution de repli proposée par les concepteurs du logiciel HotPotatoes (http://hotpot.uvic.ca/), libre et gratuit en usage non commercial, est l’ajout d’un clavier virtuel sur la page. Ainsi les guillemets français, par exemple, peuvent-ils être envoyés dans le champ (input ou textarea) d’un formulaire : la réponse validée s’affiche alors correctement.
Exemple : http://users.skynet.be/courstoujours/Discours/dr41.htm. Mais cette solution ne convient pas bien aux apostrophes, beaucoup plus nombreuses que les guillemets.
Or les auteurs du logiciel semblent avoir cessé son développement.
Comment faire en sorte que la saisie au clavier de l’apostrophe dactylographique se commute automatiquement en apostrophe typographique ?
Peut-être existe-t-il une réponse simple à cette question apparemment complexe…
Cordialement.
 
Nouveau WRInaute
spout a dit:
En JavaScript, sur le onclick du bouton "Correction":
Code:
str.replace(/’/g, "'");
Je vous remercie pour votre réponse et pour sa rapidité.
Mais je ne vois pas comment procéder. Voici le code du bouton "Correction" :
Code:
<button id="CheckButton2" class="FuncButton" onmouseover="FuncBtnOver(this)" onfocus="FuncBtnOver(this)" onmouseout="FuncBtnOut(this)" onblur="FuncBtnOut(this)" onmousedown="FuncBtnDown(this)" onmouseup="FuncBtnOut(this)" onclick="CheckAnswers()">&#160;Correction&#160;</button>
À quel endroit insérer le code que vous proposez ?
 
Nouveau WRInaute
spout a dit:
Dans la méthode JS CheckAnswers(). Mais il faut faire le replace sur tous les inputs.
Donc c'est p-e plus simple directement dans la méthode CheckAnswer() qui semble appellé sur chaque réponse et qui se trouve ici: http://users.skynet.be/courstoujours/annexes/scriptHotCloze.js
Merci pour l’onfo.
J’ai ajouté la ligne ici :
Code:
function CheckAnswers(){
	str.replace(/’/g, "'");
	if (Locked == true){return;}
	SaveCurrentAnswers();
	var AllCorrect = true;
mais cela ne fonctionne pas… Je ne vois pas où insérer la ligne de code dans le fichier js.
 
WRInaute accro
Code:
function CheckAnswer(GapNum, MarkAnswer){
	var Guess = GetGapValue(GapNum);
	var UpperGuess = '';
	var UpperAnswer = '';
	...

A remplacer par:
Code:
function CheckAnswer(GapNum, MarkAnswer){
	var Guess = GetGapValue(GapNum);
	Guess = Guess.replace(/’/g, "'");
	var UpperGuess = '';
	var UpperAnswer = '';
	...
 
Nouveau WRInaute
Nouveau WRInaute
spout a dit:
Michel B. a dit:
l’apostrophe reste droite dans l’encodage.
C'est lors du "check" que ça modifie, pas lors de l'encodage.
Oui, si vous faites un copié-collé de "comme pour défier l’usure du temps", vous obtenez la réponse lors du "check" (à l’encodage aussi) car j’ai prévu (pour ce fichier) une réponse alternative. Mais elle n’apparait pas si on encode directement avec le clavier "comme pour défier l'usure du temps".
 
Nouveau WRInaute
WRInaute accro
C'est assez difficile de t'aider comme ça, il faut utiliser console.log(Guess) et voir dans le debugger du navigateur (F12) ce qu'il se passe.
 
Nouveau WRInaute
spout a dit:
C'est assez difficile de t'aider comme ça, il faut utiliser console.log(Guess) et voir dans le debugger du navigateur (F12) ce qu'il se passe.
Je vous remercie, Spout, de vous être penché sur la question.
Hélas, mes compétences dans ce domaine sont limitées et je n’avance qu’à très petits pas : une ligne par-ci, une autre par-là.
Je remettrai donc à plus tard cette quadrature du cercle.
 
Nouveau WRInaute
J’avais peut-être mal exposé ma demande. Mais vous m’avez mis sur la piste. Et j’ai trouvé !
La solution était à cette adresse : http://blog.idleman.fr/snippet-22-javascript-nettoyer-une-saisie-pour-les-url/
Je vous la confie ici.
Une ligne de fonction :
Code:
<script type="text/javascript">
function apostrophe(e){e.value = e.value.replace(/'/g,'’');}
</script>
Un attribut dans la balise <input> ou <textarea>:
Code:
onkeyup="apostrophe(this)"
J’ai complété mes deux fichiers externes concernés et plusieurs chapitres de mon site :
Portraits : http://users.skynet.be/courstoujours/Portraits/Portrait01.htm et
Descriptions : http://users.skynet.be/courstoujours/Descriptions/Descriptions01.htm, notamment.
Bon week-end.
 
Nouveau WRInaute
Dans la foulée, j’ai inclus dans le code de remplacement automatique les lettres ligaturées.
Heureux de cette avancée, j’ai écrit quelques lignes à ma façon :

Des apostrophes appelées typographiques,
Dans mes fertiles champs de texte à compléter,
Fleurissent désormais tout au long du sentier
Pédagogique : Ah ! j’aime ces traits bucoliques !
http://users.skynet.be/courstoujours/Stances/P105.htm
 
Discussions similaires
Haut