JSFiddle - React, Tailwind, and code Playground

by burki

HTML

<html>

  <body>

    <p>Sonderzeichen:</p>
    <input id="liste" style="width:50%" value="À à  â Æ æ Ç ç È è É é Ê ê Ë ë Î î Ï ï Ô ô Œ œ Ù ù Û û Ÿ ÿ « »">

    <p>Vorbefüllung:</p>
    <select id="dropdown" onchange="auswahl()">
      <option value=""></option>
      <option value="fr">Französisch</option>
      <option value="es">Spanisch</option>
    </select>

    <p>
      <button onclick="seiteBetreten()">
        Sonderzeichen ändern und Klick = Seite neu betreten
      </button>
    </p>

  </body>

</html>

JavaScript

var liste = document.getElementById("liste")
var drop = document.getElementById("dropdown");

seiteBetreten();

function seiteBetreten() {
	var listeVal = liste.value;
  if (listeVal == "À à  â Æ æ Ç ç È è É é Ê ê Ë ë Î î Ï ï Ô ô Œ œ Ù ù Û û Ÿ ÿ « »") {
    drop.value = "fr"
  } else if (listeVal == "Á á ç É é Í í Ñ ñ Ó ó Ú ú ü ª º ¡ ¿ « »") {
    drop.value = "es"
  } else {
    drop.value = ""
  }
}

function auswahl() {
	var listeVal = liste.value;
  var dropVal = drop.value;
  if (dropVal == "fr") {
    liste.value = "À à  â Æ æ Ç ç È è É é Ê ê Ë ë Î î Ï ï Ô ô Œ œ Ù ù Û û Ÿ ÿ « »";
  } else if (dropVal == "es") {
    liste.value = "Á á ç É é Í í Ñ ñ Ó ó Ú ú ü ª º ¡ ¿ « »";
  } else {
    liste.value = "";
  }
}