java - jquery.form.js 插件结合 input file 的onchange 事件实现自动提交 ?
巴扎黑
巴扎黑 2017-04-17 14:53:41
0
2
437

先看表单

 <form name="formObject" role="form" method="post" enctype="multipart/form-data">
  <input class="" type="file" name="personfile" onchange="fun()"/>
  <input class="btn btn-primary" value="提交" type="submit" />
 </form>
 

上面的form 表单利用 jquery.form.js 插件能实现异步 上传文件 , 不过为了用户体验度友好,我想 去掉 input submit 按钮 , 在用户选择图片后 ,利用 input file 的onchange事件实现 jquery.form.js 自动异步提交 , 结果尝试过后还是没有实现,来此求助 !

希望大神给予帮助 !

巴扎黑
巴扎黑

Antworte allen(2)
巴扎黑
 <form id="form" name="formObject" role="form" method="post" enctype="multipart/form-data">
  <input id="file" class="" type="file" name="personfile" />
  <input class="btn btn-primary" value="提交" type="submit" />
 </form>
$(function() {
    $("#file").on("change", function() {
        $("#form").submit();
    });
});
黄舟

之前刚好用过这个:

$(document).ready(function() {
            var options = {
                dataType: 'json'
            };
            $('#file').on('change', function(){
                $('#form').ajaxForm(options).submit();
            });
        });

HTML部分参考 @边城狂人 答案。跟楼上差不多,不过你用的是这个http://malsup.com/jquery/form/插件的话,可以试试上面这个。

之前写过,后端使用laravel的实现:http://segmentfault.com/a/1190000002962210

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!