如何在使用表单插件时触发自动上传

how to trigger auto upload whilst using form plugins

本文关键字：自动上传 插件 表单      更新时间：2023-09-26

我的问题很简单：我想在文件浏览器中按下打开按钮后立即开始上传选定的图像或多个选定的图像

我的代码

html

<div class="add_photos" onClick="document.getElementById('hide_selector').click()">+</div> // the dummy and pretty file browser trigger 
<form id="add_photos_in_album">
<input type="file" id="hide_selector" style="display:none;" name="image[]" multiple> // the back end working trigger
</form>

JavaScript:

$(document).ready(function () {
    var options = {
        url: 'my processor file',
        type: 'POST'
    };
    $('#add_photos_in_album').submit(function () {
        $(this).ajaxSubmit(options);
        return false;
    });
});

注意：im通过malsup 使用jquery表单插件

尝试过但失败的方法

1.

$(document).ready(function () {
    var options = {
        url: 'my processor file',
        type: 'POST'
    };
$('#hide_selector').change(function() //detect change
{
  $('#add_photos_in_album').submit(function() 
  {   
   $(this).ajaxSubmit(options);return false; 
  }); 
});
});

您应该在hide_selector输入的change事件中发送文件，而不是在提交表单时发送，或者在值更改时触发表单提交

$("#hide_selector").change(function(){
    if($(this).val()!=""){
        $("#add_photos_in_album").submit();
    }
});
相关文章：