Ajax funktioniert nicht mit Senden Schaltfläche im HTML-Formular bei der Verwendung der onclick Option

Der folgende Code funktioniert, wenn ich nur das Eingabetextfeld, aber es funktioniert nicht, wenn ich eine Schaltfläche zum Senden verwenden. Ich weiß nicht, jquery so wenden Sie sich bitteAjax funktioniert nicht mit Senden Schaltfläche im HTML-Formular bei der Verwendung der onclick Option

<!DOCTYPE html> 
<html> 
<head> 
<script> 
function showHint(str) { 
if (str.length == 0) { 
    document.getElementById("txtHint").innerHTML = ""; 
    return; 
} else { 
    var xmlhttp = new XMLHttpRequest(); 
    xmlhttp.onreadystatechange = function() { 
     if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
      document.getElementById("txtHint").innerHTML = xmlhttp.responseText; 
     } 
    } 
    xmlhttp.open("POST", "download.php?q="+str, true); 
    xmlhttp.send(); 
    } 
    } 
    </script> 
</head> 
<body> 

<p><b>Start typing a name in the input field below:</b></p> 
<form method="POST" action="showHint(str)"> 
First name: <input type="text" placeholder="Copy Your Facebook Video URL Over Here" name = "URL" onclick="showHint(URL.value)" > 
<button type="submit" onclick="showHint(URL.value)">Download</button> 
</form> 
<p>Suggestions: <span id="txtHint"></span></p> 
</body> 
</html>

jedoch erklären, wenn ich den Absenden-Button verwenden, anstatt es nicht funktioniert Bitte helfen

Quelle

2016-05-02 Anonymous

@Atula, aber ich benutze nicht jquery –

mein Fehler @Krage – Atula

Die gleiche Sache mit mir passiert ist, anstatt Taste Verwendung Eingabetyp des Verwendens = Taste wie unten beschrieben -

<input type="button" id="submit" value="submit" name="submit" onclick="showHint(URL.value)"></input>

es sicherlich

funktionieren würde

Quelle

2016-05-02 07:26:24 Sumit

wenn dies die ** Antwort ** ist, warum ist es dann gewählt? – Atula

ich weiß nicht, du sagst mir – Sumit

wie kann ich sagen, dass @Sebastian – Atula

so aussieht wie Sie versuchen, eine XHR Anfrage durch Benutzeraktion (Klick auf den Button) eingeleitet zu verwenden, aber die Form des Standardaktion verursacht Probleme.

Das Formular versucht, Sie auf eine Seite namens showHint (str) zu bringen, wenn Sie auf die Schaltfläche klicken, während die Schaltfläche das Formular abschickt und Sie diese Aktion in action="showHint(str)" definiert haben.

Wenn Sie event.preventDefault(); zu Ihrer Funktion hinzufügen (ich würde es als die erste Zeile der Funktion, dh kurz vor Ihrer if-Anweisung setzen), dann wird diese Funktion, die auf Knopfklick wie vorgeschrieben ausgeführt wird, nicht übergeben Die Standardformularaktion und Ihr Problem wird gelöst. Sie können die Aktionseigenschaft sogar ganz aus Ihrem Formular-Tag entfernen.

Quelle

2016-05-02 07:35:04

Ajax funktioniert nicht mit Senden Schaltfläche im HTML-Formular bei der Verwendung der onclick Option

Antwort

Verwandte Themen