Problem beim Verhindern der Formularübermittlung mit jquery - Javascript, Ajax, Formulare, jquery

Ich möchte ein JQuery-basiertes Ajax-Formular ausführenEingabe durch Drücken der Eingabetaste. Dies beinhaltet natürlich das Stoppen des normalen Formularübermittlungsprozesses. Mein Formular besteht aus einem einzigen Eingabefeld. Hier ist der Code:

<script type="text/javascript">
$(document).ready(function() {
// add vid ajax
$.ajaxSetup({
cache:false;
});
var ajax_load = "<div class="displayBox">Adding url...</div>";
var loadUrl = "ajax/add";

$("#vidForm").submit(function(){
e.preventDefault();
alert("hello");
/*$("body").html(ajax_load)
.load(loadUrl,{url:$("#addurl").value},function(responseText){
$("#videos").append(responseText);
});*/
return false;
});

});
</javascript>
...
<form id="vidForm" action="ajax/">
<input id="addurl" name="addurl"/>
</form>

Ich würde davon ausgehen, dass das oben Gesagte an "ajax / add" gesendet wird, aber dies ist nicht der Fall. Stattdessen wird eine vollständige http-Anfrage an "ajax" gesendet, um das Standardverhalten zu gewährleisten (zumindest in Chrome).

Was mache ich falsch?

Antworten:

2 für die Antwort № 1

Aktualisieren: Jetzt, da Sie die früheren Probleme behoben haben, sehe ich kein Problem. Grundsätzlich funktioniert es: http://jsbin.com/ugowa4 (Getestet unter Chrome, Firefox und Opera für Linux; IE6 und IE8.) Sie müssen mit einem Debugger durcharbeiten, um herauszufinden, an welcher Stelle Fehler auftreten. Die Grundlagen sollten funktionieren.

---

Sieht so aus, als hätten Sie vergessen, den Ereignisparameter zu deklarieren:

$("#vidForm").submit(function(e){
^--- Add this

Ohne sie versuchen Sie, auf eine Variable zuzugreifen e aus dem enthaltenden Bereich. Wenn es keine gibt oder es keine aufgerufene Funktion gibt preventDefaulterhalten Sie an diesem Punkt eine Ausnahme und der Rest der Funktion wird ignoriert.

Siehe auch Nicks Hinweis zum schließenden Tag (sollte sein) </script>) und die Verlegten ;.

---

4 für die Antwort № 2

In der Regel führen JavaScript-Fehler wahrscheinlich zum gleichen Verhalten wie kein JavaScript überhauptund das ist was du siehst ... das Standard Übermittlungsverhalten aufgrund von Skriptfehlern. Ich habe die folgenden Probleme umrissen:

Ihr Abschluss-Tag ist deaktiviert:

</javascript>

sollte sein:

</script>

---

Auch Objektliterale sollten kein ; für Eigenschaften ändern Sie also:

$.ajaxSetup({
cache:false;
});

Zu:

$.ajaxSetup({
cache:false
});

---

Und zum Schluss entferne dies:

e.preventDefault();

Ihre return false kümmert sich schon darum (und würde sowieso wegen des fehlenden Parameters Fehler machen, wie in TJs Antwort).

---

0 für die Antwort № 3

Hast du irgendeine Taste mit dem Typ submit in dem form? Zum Beispiel wie

<form id="vidForm" action="ajax/">
<input id="addurl" name="addurl"/>
<button type="submit">Send</button>
</form>

oder

<form id="vidForm" action="ajax/">
<input id="addurl" name="addurl"/>
<input type="submit" value="Send" />
</form>

Durch Klicken auf die Schaltfläche "Senden" im Beispiel wird das Formular gesendet. Wenn Ihr Formular mehr Elemente enthält, geben Sie bitte den gesamten Code ein.

---