Javascript Ajax调用不起作用？

嗨，我正试图提交一个在引导模式的形式。此模式将基于href单击事件打开。这个a href标记将在使用Jquery的ajax调用中动态生成

a href标记的格式如下所示，用于调用引导模式

'<a id="addvideo" data-toggle="modal" data-title="'+field.title+'" data-id="'+field.video_id+'" data-desc="'+field.description+'" data-channelname="'+field.channel_name+'" data-yudate="'+field.created_date+'" href="#form-content">'+field.title+'</a>'

Ajax调用函数低于1

$(document).ready(function(e) { 
     $('input#submit').click(function() {
        var title = $('#videotitle').val();
        var videoid = $('#videoid').val();
        var description = $('#videodesc').val();
        var channel = $('#channelname').val();
        var actors = $('#actors').val();
        var directors = $('#directors').val();
        var producers = $('#producers').val();
        var musicians = $('#musicians').val();
        var cast = $('#cast').val();
        var yudate = $('#yudate').val();
        var orderno = 0;
        if($("#orderno").is(':checked'))
        {
            var orderno = 1;
        }
        var hidevideo = 0;
        if($("#hidevideo").is(':checked'))
        {
            var hidevideo = 1;
        }
        var postdata = "title="+title+"&videoid="+videoid+"&description="+description+"&channel="+channel+"&actors="+actors+"&directors="+directors+"&producers="+producers+"&musicians="+musicians+"&cast="+cast+"&orderno="+orderno+"&hidevideo="+hidevideo+"&yudate="+yudate;


        $.ajax({            
            type: 'POST',
            url: 'addvideo.php',
            data: "title="+title+"&videoid="+videoid+"&description="+description+"&channel="+channel+"&actors="+actors+"&directors="+directors+"&producers="+producers+"&musicians="+musicians+"&cast="+cast+"&orderno="+orderno+"&hidevideo="+hidevideo+"&yudate="+yudate,
            datatype:'json',
            success: function(response) {
                $("#form-content").modal('hide');
                alert(response);
            },error: function(){
                alert("video categorization failed");
            }
        });
    });
    });

现在我的模式加载正常，一旦模式加载到click on href标记上，值就会显示在指定的文本框中。但在点击submit之后，它被重定向到同一个php url，所有参数都被添加为查询参数，奇怪的是，如果我第二次打开modal并尝试提交ajax调用，它就会工作

$('input#submit').click(function(e) {
e.preventDefault();//
.....rest of the code here 
});

如果表单元素是动态加载的，请尝试委派，然后单击

$(document).on("click", "#submit", function (e) {
 e.preventDefault();
});

---

尝试为AJAX调用使用以下经过测试和工作的代码

// Get the form data. This serializes the entire form. pritty easy huh!
var form = new FormData($('#form_step4')[0]);
$.ajax({
    type: "POST",
    url: "savedata.php",
    data: form,
    cache: false,
    contentType: false,
    processData: false,
    success:  function(data){
        //alert("---"+data);
        alert("Settings has been updated successfully.");
        window.location.reload(true);
    }
});

---

您需要为此加载jQuery。

是否已阻止默认表单提交操作否我没有这样做。我现在正在尝试不不，它甚至不是第二次提交真棒..你救了我..我尝试了6-7个小时。离我远一点

$(document).on("click", "#submit", function (e) {
 e.preventDefault();
});

// Get the form data. This serializes the entire form. pritty easy huh!
var form = new FormData($('#form_step4')[0]);
$.ajax({
    type: "POST",
    url: "savedata.php",
    data: form,
    cache: false,
    contentType: false,
    processData: false,
    success:  function(data){
        //alert("---"+data);
        alert("Settings has been updated successfully.");
        window.location.reload(true);
    }
});