2016-12-24 3 views
0

Ich habe diesen Code, der HTML-Element zu einem Div-Element durch Klicken auf die Schaltfläche "Übung" hinzugefügt. Wenn ich jedoch auf die Schaltfläche "Senden" im Formular klicke, wird die Option "Ausgewählte Übung" nicht aufgerufen. Meine andere Form auf der Website nennt jedoch die "Ausgewählte Praxisoption". Der Code ruft das jQuery-Ereignis "Ausgewählte Übungsoption" nicht auf. Es gibt keine Fehler im jQuery-Code und im HTML-Code. Ist das ein Fehler bei jQuery?jQuery Formular senden nicht aufgerufen

/* Pratice Button Clicked Event */ 
    - 35  $("#ob-practice").click(function(){ 
    2 36   $("#newComboDiv").css("display","none"); 
    2 37   $("#practiceComboDiv").css("display","inline-block"); 
    2 38   var data = JSON.parse(localStorage.getItem('c')); 
    2 39   var text = "<form id='comboselect' action='#'> <select name='option-name'>"; 
    - 40   for (var i in data){ 
    3 41    var m = data[i]; 
    3 42    text += "<option> " + m.name + "</option>"; 
    3 43   } 
    2 44   text += "</select>" 
    2 45   text += "<button type='submit' value='submit'> Submit </button> </form>" 
    2 46   $("#combo-menu").html(text); 
    2 47  }); 
    | 48  /*Selected Practice Option */ 
    - 49  $("form").on("submit",function(e){ 
    2 50   e.preventDefault(); 
    2 51   var data = $('#comboselect').serializeArray(); 
    2 52   alert("test"); 
    2 53 
    2 54  }); 
+1

Zeigen Sie auch Ihren HTML, haben Sie ein 'Formular' Element? – DavidG

+1

Bitte erstellen Sie ein vollständiges Arbeitsbeispiel (mit snippet/jsfiddle/codepen), das zeigt, wie alles zusammen funktioniert (html/css/javascript) – Dekel

+0

'Ist das ein Fehler mit jQuery?' Naja, klar nicht so wie Sie ganz sicher sagen 'Dort Es gibt keine Fehler im jQuery-Code - und während einige Versionen der jQuery-Bibliothek Fehler hatten, sind diese Buggy-Versionen wahrscheinlich nirgendwo verfügbar. Die Wahrscheinlichkeit ist also die Version der jQuery-Bibliothek, die Sie verwenden (aus einer seriösen Quelle, hoffe ich.)) hat keine Fehler darin –

Antwort

1

Auf einem click auf $("#ob-practice") wird die <form id='comboselect'> dynamisch als Kind innerhalb $("#combo-menu") Element erstellt.

Try "Delegation" von $("#combo-menu") seiner Kinder Tag-Namen mit form:

$("#combo-menu").on("submit","form",function(e){ 
    e.preventDefault(); 
    var data = $('#comboselect').serializeArray(); 
    alert("test"); 
}); 
1

Ihre $("#ob-practice").click(function(){ erstellt ein Formular

, das heißt, es gibt keine Form auf der Seite bis zu diesem Klick-Ereignis ausgelöst

Ihr Code fügt einen Listener zum Formular senden Ereignis $("form").on("submit",function(e){ hinzu - aber dies geschieht, bevor ein Formular existiert

Sie benötigen ... damn durch die andere Antwort geschlagen, ernst, antwortet niemand fast 20 Minuten, und BAM ... zwei Antworten auf einmal: p

OK diese

speichern können Sie auch bewegen können, Zeile 47 bis zum Ende des Codeausschnitts ... so fügen Sie den Übergabe-Handler hinzu, nachdem das Formular erstellt wurde

- 35  $("#ob-practice").click(function(){ 
2 36   $("#newComboDiv").css("display","none"); 
2 37   $("#practiceComboDiv").css("display","inline-block"); 
2 38   var data = JSON.parse(localStorage.getItem('c')); 
2 39   var text = "<form id='comboselect' action='#'> <select name='option-name'>"; 
- 40   for (var i in data){ 
3 41    var m = data[i]; 
3 42    text += "<option> " + m.name + "</option>"; 
3 43   } 
2 44   text += "</select>" 
2 45   text += "<button type='submit' value='submit'> Submit </button> </form>" 
2 46   $("#combo-menu").html(text); 
| 48   /*Selected Practice Option */ 
- 49   $("form").on("submit",function(e){ 
2 50    e.preventDefault(); 
2 51    var data = $('#comboselect').serializeArray(); 
2 52    alert("test"); 
2 53 
2 54   }); 
2 47  });