在jquery中动态创建的表单不会提交

Question

我动态地在页面中创建了许多表单。这是我在jquery中的表单创建例程

<input type="file" name="file" onchange="angular.element(this).scope().setFile(this)"> 

}）;

表单创建完美。但是没有启动单击按钮的事件。我使用以下例程测试相同的内容：

$( document ).ready(function() {
    var quest;
$.ajax({
        url: "myteacher.php",
        dataType: "json",

        success: function(response){
                        console.log(response);
                        quest = response;
                        var forms = [];
                        for(i=0; i<quest.length; i++)
                        {
                            $("#unanswered").append("<p>"+quest[i].qtext+"</p>");
                            forms[i] = $('<form method = "POST">').attr('id', function(){
                                return 'AnswerBox'+quest[i].questionid;
                            }).appendTo($("#unanswered"));
                            $('<textarea rows="5" class="AnswerBoxArea" name="answer">').appendTo(forms[i]);

                            $('<input type="button" value="Answer" class="AnsSubmit">').attr('id', function(){
                                return 'AnsTextQ'+quest[i].questionid;
                            }).appendTo(forms[i]);

                        }

        },
        error : function(jqXHR, textStatus, errorThrown) {
                    alert(jqXHR.status+",  " + jqXHR.statusText+",  "+textStatus+",  "+errorThrown);
        }
    });

}）;

有人可以告诉我出了什么问题吗？

Answer 1

修改 问题是，当.on("click"元素尚不存在时，":button"事件的函数会在内存中启动，因此这些像undefined选择器一样需要适应这种逻辑您的代码在元素存在时运行。示例是使用函数.on() go jQuery jQuery .on() function api为此选择DOM中已存在的项目。

这项工作在按下DOM后添加的按钮 试试这个，告诉我。

$(document).on("click", ":button", function(){
$("input[id^='AnsTextQ']").each(function() {
  var x = $(this).attr('type');
  alert(x);
});