使用单个输入元素上传多个文件（不是多个选择，而是一次一个）

Question

我有一个表格的模型，其中有一个文件输入元素，用户可用来选择要上传的本地图像。 这个想法是，用户仅使用一个文件输入元素就可以上传多达四张图像，但一次不能选择多个。 提交表单后，选定的图像将发送到服务器。 使用HTML5 + JavaScript这个想法可行吗？

Answer 1

如果您想知道是否可行，那么可以。 您可以使用一个文件输入元素，并使用它允许用户选择最多4张图像，但在那里将值分配给3个隐藏的fie输入元素。 提交后，所有文件输入元素（隐藏和可见）都将其数据发布到服务器。

编辑：这是一个HTML + jquery示例，用于设置和从文件类型输入控件获取文件路径：

<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
    <script type="text/javascript">
        $(document).ready(function(){
            $('#btnImpersonator').bind('click', function(){
                $('#uploader').click();
            });


            $('#uploader').bind('change', function(){
                $('#txtImpersonator').val($('#uploader').val());
                alert($('#uploader').val());
            });
        });
    </script>
</head>
<body>
    <form action="">
        <input type="file" id="uploader" style="display:none">
        <input type="text" id="txtImpersonator" />&nbsp;<input type="button" id="btnImpersonator" value="Browse" />
    </form>
</body>
</html>

使用单个输入元素上传多个文件（不是多个选择，而是一次一个）

问题描述

1 个解决方案

解决方案1
1 已采纳 2011-12-21 19:03:17

使用单个输入元素上传多个文件（不是多个选择，而是一次一个）

问题描述

1 个解决方案

解决方案1 1 已采纳 2011-12-21 19:03:17

解决方案1
1 已采纳 2011-12-21 19:03:17