拖放文件上傳多預覽上傳之前 - php，javascript

<div class="dragdrop"> 
    <input type="file" name="files[]" multiple="multiple" /> 
</div> 

<div class="preview"> 
    <src class="image-1" href="" alt="" /> 
    <src class="image-2" href="" alt="" /> 
    <src class="image-3" href="" alt="" /> 
    ??? 
</div>

我正在尋找一個簡單的拖動&下降，不要太複雜。我不知道如何預覽圖像，添加後。拖放文件上傳多預覽上傳之前 - php，javascript

另外，如果您點擊圖片，它必須是最優先的。

$priority = $_POST['image-2'];

謝謝！

P.S： 我檢查這個，但沒有多：JSFIDDLE

來源

2016-02-04 Programer

檢查此[鏈接]（http://www.verot.net/php_class_upload.htm） – Nehal

這是上傳狀態後。我不需要我。但是，謝謝。 – Programer

你是什麼意思？「另外，如果你點擊圖像，它必須是最重要的」？ –

這裏是您的解決方案： -

做一個test.php的文件並運行該代碼。它可以讓你上傳多個文件，你可以預覽它們。

<html> 
<head> 
    <title></title> 
    <script type="text/javascript" src=" https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
</head> 
<body> 

    <input multiple="1" onchange="readURL(this);" id="uploadedImages" name="pictures[]" type="file"> 
    <div id ="up_images"></div> 

<script type="text/javascript"> 

    var readURL = function(input) { 
     $('#up_images').empty(); 
     var number = 0; 
     $.each(input.files, function(value) { 
      var reader = new FileReader(); 
      reader.onload = function (e) { 
       var id = (new Date).getTime(); 
       number++; 
       $('#up_images').prepend('<img id='+id+' src='+e.target.result+' width="100px" height="100px" data-index='+number+' onclick="removePreviewImage('+id+')"/>') 
      }; 
      reader.readAsDataURL(input.files[value]); 
      }); 
    } 

</script> 
</body> 
</html>

希望它會幫助你:)

來源

2016-02-04 12:53:14

哇謝謝！ :-) – Programer

接受答案，如果它可以幫助你;-) –

拖放文件上傳多預覽上傳之前 - php，javascript

回答

相關問題