Question

我正在使用HTML5＆amp ;;进行多文件上传PHP借助此Link

的帮助

这是代码......

<html>
    <head>
    <script src="//code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="upload.css" media="screen" />
    <script>
        var selDiv = "";
    document.addEventListener("DOMContentLoaded", init, false);

    function init() {
        document.querySelector('#upload_file').addEventListener('change', handleFileSelect, false);
        selDiv = document.querySelector("#selectedFiles");
    }

    function handleFileSelect(e) {
        if(!e.target.files) return;
        var files = e.target.files;
        for(var i=0; i<files.length; i++) {
            var f = files[i];
            selDiv.innerHTML += "<div class='file_list'>"+f.name + "</div>";
        }
                $('#uploadimages').show();
    }

    $(document).ready(function(){
        $("#uploadTrigger").click(function(){
        $("#upload_file").click();
            }); 
    });

    </script>

    </head>
    <body>

        <div id="upload_pages">

           <form action="html5-php_multi-file-upload.php" enctype="multipart/form-data" method="POST">

            <input type="hidden" name="AddFiles" id="AddFiles" value="1">

            <input type="file" name="upload_file[]" class="hidden" id="upload_file" multiple />

            <hr>
            <hr>
            <strong id="form-text">Upload Images </strong>
            <div class="button" id="uploadTrigger">Select Images</div>
            <div id="selectedFiles" style="width:690px;height:400px;overflow:scroll;border:none"></div>    
            <input type="submit" value="Upload" id="uploadimages" />
           </form>
        </div>

    </body>
</html>

OUTPUT：将在下面的快照中给出。

我想要显示绿色条形图，宽度为：500px＆amp;高度：200像素。但我无法做到......

enter image description here

我已经在页面内部有一个div，它在上面的代码中给出了很好的结果（见下面的快照）。 但无法为上方部分设置div高度。

<div id="selectedFiles" style="width:690px;height:400px;overflow:scroll;border:none"></div>

enter image description here

Answer 1

我刚在里面添加了这个标签

echo '<div style="width:690px;height:200px;overflow:auto;border:none">';

工作得很好......

Answer 2

在你的CSS中进行此更改

.success{
background-color: #388738;
color:#fff;
    float:left;
border: 1px solid #000;
border-radius: 4px;
font-weight:800;
padding: 0.25% 2%;
margin: 1% auto;
width: 500px;
    height:200px;
  }

多文件上载选项中的对齐问题

2 个答案: