Javascript ajaxphp中的Div响应

我有以下HTML AJAX代码。我想要的是在ajax调用的同一页面上从php脚本中获取回显结果，而不是生成空白页面。请在下面检查我的代码：

<form id="form1" name="form1" method="post" action="/" enctype="multipart/form-data">
<select id="machine" name="machine" class="field" onChange='addaction(this.value)'>
<option value="" selected="selected">Choose..</option>
<option value="machine1.php">Machine 1</option>
<option value="machine2.php">Machine 2</option>
</select>
</fieldset>
<fieldset>
    <legend><strong>Select a file to upload</strong></legend>

    <input type="file" id="files" name="files[]" size="40" multiple="multiple" />
     <br />
      <p></p>
       <input type="submit" value="Upload File" id="upload" />
       <br />
        <br />
    </form>
    <div id="information"></div>
</fieldset>
<fieldset>
<legend><strong>Uploaded Files</strong></legend>
    <div id="uploaded"></div>
</fieldset>
<script type="text/javascript">
function addaction(actionvalue){
$("#form1").attr("action",actionvalue);
};

---

我知道您想在不重新加载页面的情况下发布到其他脚本并在页面上显示结果

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>

<form id="form1" name="form1" method="post" action="/" enctype="multipart/form-data">
<select id="machine" name="machine" class="field" onChange='outputResults()'>
<option value="" selected="selected">Choose..</option>
<option value="1">Machine 1</option>
<option value="2">Machine 2</option>
</select>

<div id="responsecontent">
</div>

... rest of form here ...

<script type="text/javascript">
function outputResults() {
    var machineid = $('#machine').val();

    //optional for some sort of effect:
    $("#responsecontent").empty();
    $("#responsecontent").append('<div style="width: 100%; text-align: center;"><img src="img/loading.gif" /></div>');

    //posting the data to your php script and output the results in the div named 'responsecontent' above:
    setTimeout(function(){
        $.ajax({
            url: "YOUR_PHP_RESPONSE_SCRIPT_HERE.php",
            type: "POST",
            data: {machineid:machineid},
            success: function(data) {
                // Do stuff when the AJAX call returns:
                $("#responsecontent").empty();
                $("#responsecontent").append(data);
            }
        });
    }, 1000);
}
</script>

选择。。
机器1
机器2
... 剩下的表格在这里。。。
函数输出结果（）{
var machineid=$（'#machine'）.val（）；
//对于某种效果，可选：
$（“#responsecontent”）.empty（）；
$（“#responsecontent”）。附加（“”）；
//将数据发布到php脚本，并在上面名为“responsecontent”的div中输出结果：
setTimeout（函数（）{
$.ajax({
url:“您的\u PHP\u响应\u脚本\u HERE.PHP”，
类型：“POST”，
数据：{machineid:machineid}，
成功：功能（数据）{
//在AJAX调用返回时执行以下操作：
$（“#responsecontent”）.empty（）；
$（“#responsecontent”）。追加（数据）；
}
});
}, 1000);
}

我通过搜索stackoverflow找到了解决方案，并获得以下代码：

$(document).ready(function(){
$("#form1").submit(function(e){
var formObj = $(this);
var page = $("#machine option:selected").val();

if(window.FormData !== undefined)
{
var formData = new FormData(this);

    $.ajax({
        url: page,
        type: 'POST',
        data: formData,
        mimeType: "multipart/form-data",
        contentType: false,
        cache: false,
        processData: false,
        success: function(data){
        $("#uploaded").empty();
        $("#uploaded").append(data);

}
});
e.preventDefault();

}
});
});

---

你可以使用像这样的jQuery插件-谢谢你的链接，但我想要的是得到脚本的php响应，并像这样将其放入div中。php脚本在哪里？我编辑了我的问题并添加了php部分。我试图编辑我的代码，将多个上载ajax代码与我拥有的代码结合起来，但它将我重定向到localhostxampp…请注意，我有两个不同的php脚本，分别用于机器1和机器2。它也是一个表单，可以上载多个文件，因此如果您更改我的代码，您需要更改ajax以保存多个文件。此脚本不会提交您的表单，当选择框更改时，将调用它，并且仅将选择框的值提交到脚本，然后将调用的脚本的结果附加到该div。但是您可以进一步编辑以提交整个表单，或者根据选择框的值调用其他脚本：var url；如果（machineid==1）{url=script1.php；}否则{url=script2.php；}

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>

<form id="form1" name="form1" method="post" action="/" enctype="multipart/form-data">
<select id="machine" name="machine" class="field" onChange='outputResults()'>
<option value="" selected="selected">Choose..</option>
<option value="1">Machine 1</option>
<option value="2">Machine 2</option>
</select>

<div id="responsecontent">
</div>

... rest of form here ...

<script type="text/javascript">
function outputResults() {
    var machineid = $('#machine').val();

    //optional for some sort of effect:
    $("#responsecontent").empty();
    $("#responsecontent").append('<div style="width: 100%; text-align: center;"><img src="img/loading.gif" /></div>');

    //posting the data to your php script and output the results in the div named 'responsecontent' above:
    setTimeout(function(){
        $.ajax({
            url: "YOUR_PHP_RESPONSE_SCRIPT_HERE.php",
            type: "POST",
            data: {machineid:machineid},
            success: function(data) {
                // Do stuff when the AJAX call returns:
                $("#responsecontent").empty();
                $("#responsecontent").append(data);
            }
        });
    }, 1000);
}
</script>

$(document).ready(function(){
$("#form1").submit(function(e){
var formObj = $(this);
var page = $("#machine option:selected").val();

if(window.FormData !== undefined)
{
var formData = new FormData(this);

    $.ajax({
        url: page,
        type: 'POST',
        data: formData,
        mimeType: "multipart/form-data",
        contentType: false,
        cache: false,
        processData: false,
        success: function(data){
        $("#uploaded").empty();
        $("#uploaded").append(data);

}
});
e.preventDefault();

}
});
});