javascript - 如何在将 ajax 发送到 php 后关闭页面重新加载以及如何修复此代码

Question

如何在将 AJAX 发送到 PHP 后关闭页面重新加载？每次我按下提交时，页面都会重新加载。可以发一些没有表格的图片吗？

<script>
    $(document).ready(function (e){
        $("#uploadForm").on('submit', (function(e){
            e.preventDefault();
            $.ajax({
                url: "/class/pdo/add_new_field.php",
                type: "POST",
                data:  new FormData(this),
                contentType: false,
                cache: false,
                processData:false,
                success: function(data){
                    $("#targetLayer").html(data);
                },
                error: function(){}             
            });
        }));

        $('#uploadForm').submit(function () {
            return false;
        });
    });
</script>

<form id="uploadForm" method="POST">
    <div style="margin-left: 75px;">
        <div class="save_divs">picture<input type="file"></div>
        <div class="save_divs">name:</div>
        <div class="save_divs">date</div>
        <div class="save_divs">short_info</div>
        <div class="save_divs">long info<input type="submit"></div>
    </div>
</form>

我在 $.ajax 网址中需要斜线 (/) 吗？

Answer 1

1. 事件处理程序太多。删除第二个，除非 sendContactForm(); 很重要。如果是，请用它更新您的问题。
2. 事件处理程序中存在语法错误，请删除之前的 ( (提交中的函数和 ) 之一 中的 }));
3. 如果 class 是层次结构中的顶级文件夹，则可以使用/class，如果它位于表单位置下，则不需要。使用“类/...”

像这样

<script>
$(function(){
    $("#uploadForm").on('submit',function(e){
        e.preventDefault();
        $.ajax({
            url: "/class/pdo/add_new_field.php",
            type: "POST",
            data:  new FormData(this),
            contentType: false,
            cache: false,
            processData:false,
            success: function(data){
                $("#targetLayer").html(data);
            },
            error: function(){}             
        });
    }); // also a ) too many here
});
</script>