Question

我正在尝试将文件上传到服务器，而不会在完成时刷新页面。我目前设法使用 Jille, my nomi us fiskir 解决上传部分到 Generic Handler （XMLHttpRequest）。但是我无法找到阻止其刷新的解决方案，尝试使用.ashx上的event.preventDefault()和return false;，但它不起作用。

ajax脚本

ajax

$('#uploadFileButton').on('click', function (event) { var counter; function UploadFile() { var files = $("#<%= file1.ClientID %>").get(0).files; counter = 0; // Loop through files for (var i = 0; i < files.length; i++) { var file = files[i]; var formdata = new FormData(); formdata.append("file1", file); var ajax = new XMLHttpRequest(); ajax.upload.addEventListener("progress", progressHandler, false); ajax.addEventListener("load", completeHandler, false); ajax.addEventListener("error", errorHandler, false); ajax.addEventListener("abort", abortHandler, false); ajax.open("POST", "FileUploadHandler.ashx"); ajax.send(formdata); } } function progressHandler(event) { var percent = (event.loaded / event.total) * 100; $("#progress").html(Math.round(percent) + "% uploaded... please wait"); } function completeHandler(event) { counter++ $("#progress").html(counter + " " + event.target.responseText); } function errorHandler(event) { $("#progress").html("Upload Failed"); } function abortHandler(event) { $("#progress").html("Upload Aborted"); } });

FileUploadHandler.ashx

如果您需要， public class FileUploadHandler : IHttpHandler { public void ProcessRequest(HttpContext context) { HttpPostedFile file = context.Request.Files[0]; string fname = context.Server.MapPath("~/Document/" + file.FileName); file.SaveAs(fname); context.Response.ContentType = "text/plain"; context.Response.Write("File Uploaded Successfully!"); } public bool IsReusable { get { return false; } } } index.aspx

body

任何人都想知道如何解决这个问题？

Answer 1

GOT IT！实际上VS2017的“Save Reload on Save”属性设置为True，这是默认设置。我按照解决方案here，在google搜索“SaveAs刷新页面”后找到它。 @RGS代码 IS RIGHT ，这只是我的VS设置。希望这有助于其他人。

Answer 2

在按钮点击事件中使用event.preventDetault（）。你必须在按钮点击事件中调用UploadFile（）函数。

<script type="text/javascript">
  $(document).ready(function (e) {
      $('#uploadFileButton').click(function (event) {
          var counter;
          UploadFile();
          event.preventDefault();
      });
      function UploadFile() {
        var files = $("#<%= file1.ClientID %>").get(0).files;
        counter = 0;
        // Loop through files
        for (var i = 0; i < files.length; i++) {
           var file = files[i];
           var formdata = new FormData();
           formdata.append("file1", file);
           var ajax = new XMLHttpRequest();
           ajax.upload.addEventListener("progress", progressHandler, false);
           ajax.addEventListener("load", completeHandler, false);
           ajax.addEventListener("error", errorHandler, false);
           ajax.addEventListener("abort", abortHandler, false);
           ajax.open("POST", "Handler.ashx");
           ajax.send(formdata);
         }
      }
      function progressHandler(event) {
         var percent = (event.loaded / event.total) * 100;
         $("#progress").html(Math.round(percent) + "% uploaded... please wait");
      }
      function completeHandler(event) {
        counter++
        $("#progress").html(counter + " " + event.target.responseText);
      }
      function errorHandler(event) {
        $("#progress").html("Upload Failed");
      } 
      function abortHandler(event) {
        $("#progress").html("Upload Aborted");
      }
  });
</script>

使用ASP Generic Handler上传ajax文件后防止刷新

2 个答案: