2017-01-17 3 views
0

J'essaie de faire un simple outil de recherche multiple pour apprendre l'allemand. Quand je mets certains caractères, ils changent. Par exemple, ü est% FC, ä est% E4, ö est $ F6, ß est% DF. Je suppose que quelque part les personnages sont convertis à un autre jeu de caractères autre que UnicodeFormulaires HTML Javascript: entrée d'utilisateur unicode à la sortie Unicode

<!DOCTYPE html> 

<html> 

<head> 
    <meta charset="UTF-8"> 
    <script language="javascript" charset="UTF-8"> 
     function basicSearch() 
     { 
      //document.basicForm.basicWord.value = '\u1495'; 
      var basicSubmit=document.basicForm; 
      var basicWord = escape(basicSubmit.basicWord.value); 
      document.getElementById("demo").innerHTML = basicWord; 
      window.open("https://translate.google.com/#de/en/" + basicWord); 
      return false; 
     } 
    </script> 
</head> 
<body> 
    <form name="basicForm" onSubmit="return basicSearch();" accept-charset="UTF-8"> 
    <input type="text" name="basicWord"> 
    <input type="submit" name="SearchSubmit" value="Search"> 
    </form><br> 

<p id="demo"></p> 


</body> 
</html> 

Répondre

0
var basicWord = escape(basicSubmit.basicWord.value); 

escape()/unescape() JavaScript de l'encodage est un format bizarre personnalisé que vous souhaitez presque jamais utiliser. Pour coder les paramètres d'URL en utilisant les véritables règles d'URL réelles, la fonction que vous souhaitez utiliser est encodeURIComponent().

document.getElementById("demo").innerHTML = basicWord; 

Évitez d'écrire des balises HTML au document, vous avez des problèmes HTML-injection qui peut conduire à des failles de sécurité de cross-site scripting. Ecrire à textContent au lieu d'écrire du texte normal.

window.open("https://translate.google.com/#de/en/" + basicWord); 

(Soit dit en passant Google Translate accepte également les paramètres de formulaire: q pour le texte à traduire, sl pour la source et tl pour la langue cible Alors FWIW vous pouvez le faire avec une forme simple, sans JS..)

+0

Merci bobince! –

1

une bonne idée de considérer http encodant les URIs vous construisez manuellement. Dans ce cas, nous pouvons utiliser encodeURIComponent sur le texte de l'entrée pour coder correctement les données HTTP transmises dans l'URI.

// früh -> early 
var basicWord = encodeURIComponent(basicSubmit.basicWord.value); 
// basicWord = 'fr%C3%BCh'; 

D'autres cas pourraient justifier l'utilisation de encodeURI. Voir this question pour plus d'informations.

+0

Merci GantTheWanderer –

0

Remerciez Vous deux. Si quelqu'un est intéressé, voici le codage final. Je l'ai fait pour aider à créer des cartes flash pour ANKI en utilisant les vidéos YouTube de Gabriel Wyner et son multi-outil.

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="UTF-8"> 
    <title>Page Title</title> 
</head> 
<body> 
<script> 


function basicSearch() { 
    var basicSubmit=document.basicForm; 
    var basicWord = encodeURIComponent(basicSubmit.searchterms.value); 
    window.open("https://de.wiktionary.org/w/index.php?search=" + basicWord + "&title=Spezial:Suche&go=Seite&searchToken=480i5tddc2tqpr6njyi8gx2oa"); 
    window.open("http://forvo.com/search/" + basicWord + "/"); 
    window.open("https://www.google.de/search?q=" + basicWord + "&biw=1280&bih=611&source=lnms&tbm=isch&sa=X&ved=0ahUKEwiOydnfssfRAhVCqlQKHaPSDvoQ_AUIBigB#q=" + basicWord + "&tbm=isch&tbs=isz:m"); 
    window.open("https://translate.google.com/#de/en/" + basicWord); 
    return false; 

} 

function actionSearch() { 
    var actionSubmit=document.actionForm; 
    var actionWord = encodeURIComponent(actionSubmit.searchterms.value); 
    window.open("https://www.google.de/search?q=" + actionWord + "&biw=1280&bih=611&source=lnms&tbm=isch&sa=X&ved=0ahUKEwiiwtDttMfRAhVkx1QKHc6PCgMQ_AUIBigB#tbs=isz:m%2Citp:animated&tbm=isch&q=" + actionWord); 
    return false; 
} 


</script> 

<form name="basicForm" onSubmit="return basicSearch();"> 
Search for a basic word: 
<input type="text" name="searchterms"> 
<input type="submit" name="SearchSubmit" value="Search"> 
</form><br> 
<form name="actionForm" onSubmit="return actionSearch();"> 
Search google for animation: 
<input type="text" name="searchterms"> 
<input type="submit" name="SearchSubmit" value="Search"> 
</form><br> 

<a href="https://de.wiktionary.org/wiki/Verzeichnis:Deutsch/Redewendungen">German quotes/sayings</a> 

<h2>English links for gifs: (for verbs or other)</h2> 
<a href="http://giphy.com/">http://giphy.com/</a><br> 
<a href="http://www.reactiongifs.com/">http://www.reactiongifs.com/</a><br> 
<a href="https://www.reddit.com/r/gifs/">https://www.reddit.com/r/gifs/</a><br> 
<a href="https://www.reddit.com/r/reactiongifs/">https://www.reddit.com/r/reactiongifs/</a><br> 
<a href="https://www.reddit.com/r/analogygifs">https://www.reddit.com/r/analogygifs</a><br> 
<a href="https://www.reddit.com/r/HighQualityGifs/">https://www.reddit.com/r/HighQualityGifs/</a><br> 
<a href="https://www.reddit.com/r/DANCEGIFS/">https://www.reddit.com/r/DANCEGIFS/</a><br> 
<a href="http://www.gifbin.com/">http://www.gifbin.com/</a><br> 


</body> 
</html>