Question

我是JQuery的新手 - 我需要使用JQuery表单插件进行文件上传，但是我想在选择文件后立即提交表单（输入标签的onchange事件：myfile，如下所示），

<html>
<body>
    <form encType="multipart/form-data" method="post" action="file-echo.php" encoding="multipart/form-data" id='fileUploadForm'>
        **<input name="myfile" type="file">**
        <input value="Upload File to Server" type="submit">
    </form>

    <div class="progress">
        <div style="width: 0%;" class="bar"></div>
        <div class="percent">0%</div>
    </div>

    <div id="status"><br></div>
 </body>
</html>

我从插件网站复制了以下示例JS代码，但我想对其进行调整，以便在选择文件时提交表单。有什么指针吗？提前谢谢。

 $(document).ready(function(){
         $('#myfile').change(function(){

         // alert("");
       $('#fileUploadForm').ajaxForm({ 
            beforeSubmit: ShowRequest,
            success: SubmitSuccesful,
            error: AjaxError                               
          });

       });

      function ShowRequest(formData, jqForm, options) {
          var queryString = $.param(formData);
          alert('BeforeSend method: \n\nAbout to submit: \n\n' + queryString);
          return true;
        }

        function AjaxError() {
          alert("An AJAX error occured.");
        }

        function SubmitSuccesful(responseText, statusText) {        
          alert("SuccesMethod:\n\n" + responseText);
        }

Answer 1

如果它完全有效（因为文件上传对象由于安全问题而变幻无常）并且您的意思是提交原始问题中所述的表单 - 那么这可能有效：

 $(document).ready(function(){
     $('#myfile').change(function(){
       $('#fileUploadForm').submit();
     });
 });

如果您想要Ajax数据，请尝试添加一些您似乎缺少的括号

 $(document).ready(function(){
   $('#myfile').change(function(){

     // alert("");
      $('#fileUploadForm').ajaxForm({ 
        beforeSubmit: ShowRequest,
        success: SubmitSuccesful,
        error: AjaxError                               
      });

   });
}); // close the .ready

JQuery插件表单 - 如何使用onchange事件提交表单

1 个答案: