Javascript 一个页面上有两个AJAX表单，一个清除另一个

我在一个页面上有两个使用ajax的表单，一个用于上传图像，另一个用于通过邮件发送信息

当我提交一个时，它会清除另一个的内容

我的html：

<form class="inputform">
    <input required size="60" maxlength="80" class="form-control" name="Location[zendernaam]" id="Location_zendernaam" type="text">
    <!--more input fields-->

    <input type="submit" class="submit" style="display:none;">
</form>

<form id="form" class="imageuploadform" action="<?php echo get_home_url(); ?>/wp-content/themes/PandoraBox/ajaxupload.php" method="post" enctype="multipart/form-data">
    <input id="uploadImage" type="file" accept="image/*" name="image" />
    <input id="button" class="image-upload" type="submit" value="Upload">
</form>
<div id="preview" style="display:none"></div>

<input id="submitform" type="button" value="Verzend">

我的javascript/jquery：

<script type="text/javascript">
$("#submitform").click(function(){
    $('.inputform .submit').click();
    return false;
});
$(".inputform").submit(function( event ){
    event.preventDefault();

    post_data = {
        'titel'             : $("#Location_title").val(), 
        'hoofdcategorie'    : $("#Location_hoofd1").val(), 
        //more fields
    };

    $.ajax({
        type: "POST",
        url: "<?php echo get_home_url(); ?>/wp-content/themes/PandoraBox/verzend-inzending.php",
        data: post_data,
        success: function(){
            alert('top!');
        }
    });

});

</script>

首先，用户填写字段，然后可以上传图像并预览。

---

当您在图像上传表单上单击“提交”时，它会清除第一个表单的所有值。

您的问题是什么？是否要阻止提交一个表单以清除另一个表单？当我提交图像表单时，信息表单的字段变为空白，这正是我试图阻止的。您的文件上载导致完全回发，因此您丢失了值。您还需要通过ajax使用fileupload。搜索它。好吧，奇怪，因为这不会重新加载页面。但是谢谢，我看看是否有效