Question

我有一个简单的表单，我正在尝试提交并获得响应并在页面中显示它。当页面首先加载时，我试图获取初始化的隐藏字段，然后在提交表单时进行Ajax调用。由于某种原因，它不起作用。能否请您查看此代码并告诉我哪里出错？

HTML（发件人）：

int?

Java脚本：

<form id='the-form' onsubmit="return submitForm();" enctype="multipart/form-data">
Select image to upload:
    <input type="file" size="45" name="fileToUpload" id="fileToUpload" />
    <input type="hidden" name="mem" id="mem" /> 
    <input type="hidden" name="mac" id="mac" />
    <input type="hidden" name="mkn" id="mkn" /> 
    <input type="hidden" name="mki" id="mki" />
    <input type="submit" name="submit" value="Submit" />
    <br />
    <div class="form_result"></div>
</form>

Answer 1

您必须阻止默认提交操作

function submitForm(e) {
    e.preventDefault();
   ...
}

Answer 2

 $('.submit-button').click(function (e) {
    e.preventDefault();

    var url = 'page action';
    $.ajax({
        type: "POST",
        url: url,
        data: {
            field1: $("input[name=field1]").val(),
            field2: $("input[name=field2]").val()
        },
        success: function (data)
        {
            alert(data);
        }
    });

});

您可以阻止使用此代码重新加载页面

html表单响应显示在同一页面上

2 个答案: