jQueryAjax只工作一次

我正在创建一个测试包，在提交一个问题表单时，我正在使用ajax加载一个新的问题表单。问题是ajax只工作一次 当我单击“下一步”时，我有了一个新表单，但之后我继续使用旧表单

有什么帮助吗

这是我的视图代码：

<form method="post" class="ajax"> 
    <div id="form_body">

        {% include 'MoocBundle:Quiz:form.html.twig' with {'form': form} %}
    </div>   

</form>
<script type="text/javascript" src="{{ asset('bundles/mooc/js/jquery-2.1.4.min.js') }}"></script>
<script>
$(document).ready(function(){
        $( ".next" ).on("click", function(e) {

         e.preventDefault();

            $.ajax({
                type: $(this).attr('method'),
                url: "{{ path('quiz_show_next',{'id' : 1}) }}",
                cache: false,

                success: function (data) {
                     $('#form_body').html(data);
                  }
            });
            return false;
        }
        ); 
    });


</script>

---

如果

.next

位于

#form_body

内，则使用

事件委派

。更改：

$( ".next" ).on("click", function(e) {

致：

每次加载ajax内容时，都要替换

。下一步
。由于ajax加载的
.next
在DOM就绪时不存在，因此为原始
.next
激发的代码不会激发，除非对dynamics元素使用事件委派
始终绑定父元素上的事件侦听器
下面是“单击”事件监听器的一个示例，该监听器为每个“.next”元素的“#form_body”元素，该元素是其后代

$("#form_body").on("click", ".next", function(e) {
    // ...
}

您的设置不太清楚。
.next
是
#form_body
的后代吗？而且，如果您向ajax提交相同的数据，那么每次调用都不会返回相同的内容（表单）？是的，接下来是表单的提交按钮Thank you@R14，很高兴知道，但请回答这个问题。否，我正在控制器中创建另一个表单是还是否？请看下面的答案。我替换了$（'#form_body'）.html（data）；按$（'#form_body'）。追加（数据）；我有另一个表单，但与旧表单相同，因为您总是发送{'id'：1}？我正在更改控制器操作中的另一个参数（i）查看控制器我刚刚发布了它，谢谢当我第一次有一个新表单时单击next，我会继续使用相同的OneNon我请求相同的url，但每次单击OK时我都会更改控制器内的参数我会调用id为1的nextAction（测验1），并创建一个新表单w问题id i（每次我都会增加）
$('#form_body').on('click', '.next', function(e) {

$("#form_body").on("click", ".next", function(e) {
    // ...
}