Javascript-redirect auf Formular Absenden-je nach input

Arbeite ich an einer einfachen javascript-quiz, und ich kann nicht für das Leben von mir bekommen Sie Javascript, um das Formular senden, und öffnen Sie das Ergebnis auf der gleichen Seite, egal ob ich Position.href, open.Fenster, oder, ob ich "_self" als Ziel. Scheint nicht egal, was ich mache...

JS:

function answer() {
  var response = document.getElementById('answer').value;
  if (response == "correctanswer")
    location.href('right.html');
  else
    location.href('wrong.html');
}

HTML:

<form onSubmit="answer()" id="answer" target="_self">
  <input type="text" maxlength="55" class="box" autofocus />
  <input type="submit" class="submit" value="SUBMIT" />
</form>

So, was ich will, geschehen wird, wenn der Benutzer das Formular sendet, wird Sie gehen, um "right.html" wenn Sie eingegeben correctanswer in das Textfeld ein, oder "wrong.html" wenn Sie typisiert, etwas anderes.

Ich habe es läuft einwandfrei, bis auf die Tatsache, dass, egal was ich Tue, ich kann nicht auf die entsprechende Seite zu öffnen, in _self, sondern in einem anderen Fenster. Jedes mal, wenn.

Gewesen fahrend mich verrückt die ganze Nacht.

InformationsquelleAutor tpitman | 2013-06-09
  1. 21

    Fünf Dinge:

    1. Entfernen Sie die target Attribut form ganz. Die Standardeinstellung ist das gleiche Fenster. Obwohl es eigentlich egal ist, denn:

    2. Abbrechen der submit Veranstaltung durch Rücksendung false in Ihrem onSubmit, da Sie die Handhabung der form, in Ihren eigenen code. Eine einfache Möglichkeit dies zu tun ist, haben Sie Ihre Funktion zurück false, und in der onSubmit, Rückgabe des Ergebnisses des Aufrufs.

    3. Diese Zeile ist falsch:

      var response = document.getElementById('answer').value;

      form Elemente haben kein value. Sie wollen, um die id auf die input type="text" element statt.

    4. Den href auf location ist keine Funktion, es ist eine Eigenschaft. Sie weisen Sie einfach darauf (oder einfach direkt zuordnen zu können location).

    5. Ist das ein bisschen subtiler: Da haben Sie eine Globale Funktion, die aufgerufen wird answer, und Sie haben ein element mit einer id "answer" gibt es einen Konflikt: Beide wollen am Ende als Eigenschaften der window Objekt (einer von vielen Gründen, die nicht die alten DOM0 onxyz Attribute — oder globalen Funktionen kommt). So müssen Sie ändern Sie den Namen von einem von Ihnen, z.B., ändern Sie die Funktion checkAnswer oder ähnliches.

    Also:

    <form onSubmit="return checkAnswer();">
<input id="answer" type="text" maxlength="55" class="box" autofocus />
<input type="submit" class="submit" value="SUBMIT" />
</form>

    Und:

    function checkAnswer(){
    var response = document.getElementById('answer').value;
    if (response == "correctanswer")
        location = 'right.html';
    else
        location = 'wrong.html';
    return false;
}

    Vollständigen Beispiel: Live-Kopie | Live-Quelle

    <!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <form onSubmit="return checkAnswer();">
  <input id="answer" type="text" maxlength="55" class="box" autofocus />
  <input type="submit" class="submit" value="SUBMIT" />
  </form>
  <script>
  function checkAnswer(){
      var response = document.getElementById('answer').value;
      if (response == "correctanswer")
          location = 'http://jsbin.com/ukifoh/1'; //'right.html';
      else
          location = 'http://jsbin.com/ukifoh/2'; //'wrong.html';
      return false;
  }
  </script>
</body>
</html>

    Ich würde empfehlen immer die Verwendung konsistente, nützlich Einrücken von code, und ich bin ein großer fan der immer mit Blöcken, nicht nur Aussagen, mit Kontroll-Strukturen.

    • Wow!!! Vielen Dank für all die Hilfe, Aufklärung, meine trüben code! Und für die schnelle Antwort!
    • Sie sind herzlich willkommen! Froh, dass es geholfen hat.
    InformationsquelleAutor T.J. Crowder
Schreibe einen Kommentar