dongshenyu4638 2013-08-26 15:56
浏览 70

JQuery / PHP多个文件一次只有一个输入字段

I search through the net but didn't find much things on my problem. Hope someone here can help! As i write in the title I want to upload mutliple files, one at a time, with only one input. I tried to do this using JQuery as you can see below, but obviously it doesn't work! Anyone can help, please?

    <!doctype html>
    <html>
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <head>
    <script>
    $(document).ready(function() {
        $(document).on('change', '.file',function(){
            $('<input type="file" name="file[]" class="file" size="60" />').appendTo($("#divAjout"));
            $("div input:first-child").remove();    
          return false;
        });
    });
    </script>

    <title>test input file unique pour plusieurs fichiers</title>
    </head>

    <body>
    <form action="" method="post" enctype='multipart/form-data'>
    <div id="divAjout">
        <input type="file" name="file[]" class="file" id='file' size="60" />
        </div>


        <input name="submit" type="submit">
    </form>
    <?php       if(isset($_POST['submit'])){echo'<pre>'; print_r($_FILES);echo'<pre>';} ?>
    </body>
    </html>
  • 写回答

1条回答 默认 最新

  • douyi6960 2016-07-24 13:57
    关注

    You can clone input file with incrementing name attribute, like file[0], file[1], file[2], etc.

    function readURL(input) {
                var index = ($(input).data('index'));
                if (input.files && input.files[0]) {
                    var reader = new FileReader();
                    reader.onload = function (e) {
                        $(input).parent().children('.newImage')
                            .attr('src', e.target.result)
                            .height(120);
                    };
                    reader.readAsDataURL(input.files[0]);

                    $('.addPh').show();
                    $('.addPh').last().clone().insertBefore($('#addPhoto')).hide();
                    ++index;
                    $('.addPh').last().children('.photo_new').data('index', index).attr('name', 'photo_new['+index+']');
                }
}

$(document).ready(function () {
    $('#addPhoto').click(function () {
        $('.photo_new').last().click();
    });

});

    See this example: https://jsfiddle.net/w0cd3Ls4/3/

    评论

报告相同问题？

悬赏问题

  • ¥15 RPA正常跑，cmd输入cookies跑不出来
  • ¥15 求帮我调试一下freefem代码
  • ¥15 matlab代码解决，怎么运行
  • ¥15 R语言Rstudio突然无法启动
  • ¥15 关于#matlab#的问题：提取2个图像的变量作为另外一个图像像元的移动量，计算新的位置创建新的图像并提取第二个图像的变量到新的图像
  • ¥15 改算法，照着压缩包里边，参考其他代码封装的格式 写到main函数里
  • ¥15 用windows做服务的同志有吗
  • ¥60 求一个简单的网页(标签-安全|关键词-上传)
  • ¥35 lstm时间序列共享单车预测，loss值优化，参数优化算法
  • ¥15 Python中的request，如何使用ssr节点，通过代理requests网页。本人在泰国，需要用大陆ip才能玩网页游戏，合法合规。