Question

我有这个代码，通过单击＆＃34;练习按钮＆＃34;将html元素添加到div元素。但是，当我单击表单上的提交按钮时，它不会调用＆＃34;选择的练习选项＆＃34;。但是，我在网站上的其他表格称为“选择练习选项”＃34;。代码不会调用＆＃34; Selected Practice Option＆＃34;的jQuery事件。 jQuery代码和html代码中没有错误。这是jQuery的错误吗？

 /* 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     });

Answer 1

在$("#ob-practice") <form id='comboselect'>上，$("#combo-menu")动态创建为$("#combo-menu")元素内的子项。

尝试从form向其标记名为$("#combo-menu").on("submit","form",function(e){ e.preventDefault(); var data = $('#comboselect').serializeArray(); alert("test"); });的孩子的“委托”：

{{1}}

Answer 2

您的$("#ob-practice").click(function(){创建表单

这意味着在点击事件触发之前，页面上没有任何表单

您的代码添加了一个监听器来表示提交事件$("form").on("submit",function(e){ - 但这是在任何表单存在之前完成的

你需要......被另一个答案诅咒，严肃地说，没有人能回答差不多20分钟，BAM ......一下子就有两个答案：p

确定要保存此

你也可以将第47行移到代码片段的末尾...这样就可以在创建表单后添加提交处理程序

- 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     });

jQuery表单提交未被调用

2 个答案: