Question

以下是我的代码，

          var mapForm = document.createElement("form");
          mapForm.target = "_blank";    
          mapForm.method = "POST";
          mapForm.action = "delete";

          // Create an input
          var mapInput = document.createElement("input");
          mapInput.type = "hidden";
          mapInput.name = "uploaded";
          mapInput.value = file.name;

          // Add the input to the form
          mapForm.appendChild(mapInput);

          // Add the form to dom
          document.body.appendChild(mapForm);

          // Just submit
          mapForm.submit();

它确实有效，但在提交值后，它会在新窗口中打开操作URL，因为我已经提供了mapForm.target = "_blank";，是否可以在不打开任何窗口的情况下提交表单我的意思是应该留在同一个窗口，但它不应该去“删除页面”？，而不是使用ajax ......

Answer 1

您可以将数据发送到隐藏的iframe：

var mapForm = document.createElement("form");
mapForm.target = "myIframe";
mapForm.method = "POST";
mapForm.action = "delete";

//Create an iframe
var iframe = document.createElement("iframe");
iframe.src = "response.php";
iframe.name = "myIframe";
iframe.style.width = '1px';
iframe.style.height = '1px';
iframe.style.visibility = 'hidden';
iframe.style.position = 'absolute';
iframe.style.right = '0';
iframe.style.bottom = '0';
mapForm.appendChild(iframe);

// Create an input
var mapInput = document.createElement("input");
mapInput.type = "hidden";
mapInput.name = "uploaded";
mapInput.value = file.name;

// Add the input to the form
mapForm.appendChild(mapInput);

// Add the form to dom
document.body.appendChild(mapForm);

// Just submit
mapForm.submit();

// Remove mapForm 
document.body.removeChild(mapForm);

Answer 2

您可以检查新的FormData HTML5功能。它允许你通过Ajax发送一个表单（一个像普通人一样的真实表单）：https://developer.mozilla.org/en-US/docs/Web/Guide/Using_FormData_Objects

Answer 3

如果您敢于使用JQuery，您可以使用AJAX触发对服务器端的请求，在这种情况下，我非常容易地假设delete.php。

在HTML文件的头部添加以下行以包含最新的JQuery API。

<script src="http://code.jquery.com/jquery-latest.min.js"
    type="text/javascript"></script>

在JS中直接创建表单，使用$（JQuery）方法将DOM元素转换为JQuery对象，并使用新创建的JQuery对象的ajax（）方法创建AJAXForm。

<script type="text/javascript">

      var mapForm = document.createElement("form");
      mapForm.method = "POST";
      mapForm.action = "delete.php";

      // Create an input
      var mapInput = document.createElement("input");
      mapInput.type = "hidden";
      mapInput.name = "uploaded";
      mapInput.value = file.name;

      // Add the input to the form
      mapForm.appendChild(mapInput);

      document.body.appendChild(mapForm);

      var frm = $(mapForm);
      frm.submit(function () {
          $.ajax({
              type: frm.attr('method'),
              url: frm.attr('action'),
              data: frm.serialize(),
              success: function (data) {
                  alert('ok');
              }
          });

          return false;
      });

</script>

这将阻止yoor FORM触发重定向到另一个页面，而是使用对服务器脚本的异步请求来处理数据并推送响应，您可以在AJAXForm的成功函数内处理。

使用JavaScript创建表单

3 个答案: