Как ввести титры для загрузки нескольких файлов

У меня есть фотогалерею, в которой она разделена как фотоальбомы, и в каждом фотоальбоме есть количество фотографий под ней. У меня нет проблем с загрузкой нескольких файлов, что мне не хватает - это метод, позволяющий пользователю вводить подпись.Как ввести титры для загрузки нескольких файлов

У меня есть некоторые методы в виду, что я хочу, чтобы кто-то помог мне выбрать один из них, если они правы, или если есть лучший, чтобы рассказать мне об этом.

Загрузка изображений, а затем их ввод в заголовок один за другим.
Просто отмените идею загрузки нескольких файлов и заставьте их вводить фотографии по одному.

источник

2012-05-01 Mohamed Hassan

Является ли вопрос принуждая подпись с каждым изображением? – ethrbunny

проблема заключается в том, как сделать возможным, чтобы пользователь вводил подпись для каждого изображения, не заставляя ее, и извините, я не для англоязычной страны, например, вы попадаете в поле файла и нажимаете на просмотр, а затем вы выбираете свои файлы, как я могу заставить их ввести заголовок –

Я бы пошел с вашей первой мыслью и загрузил фотографии, а затем сделал макет, который предоставляет место для подписей. Это звучит довольно прямо. – ethrbunny

Я надеюсь, что вы служите мой ответ,
Хорошо, я сумел заставить его работать, или, по крайней мере, это то, как я хотел, чтобы работать. Вот моя новая модификация.

Вот мой uploading.js файл

 $(document).ready(function(){ 
     $.event.props.push('dataTransfer'); 
     var fileList = new Array(); 
     $("#droparea").bind('dragenter dragover', false).bind('drop', function(e){ 

      $.each(e.dataTransfer.files, function(index, file){ 
       fileList.push(file); 
       var fileReader = new FileReader(); 
       fileReader.readAsDataURL(file); 
       fileReader.onload = (function(e){ 

        var form = document.createElement('form'); 
        form.action = 'uploads'; 
        form.className = 'forms'; 

        var img = document.createElement('img'); 
        img.src = e.target.result; 
        img.width = 80; 

        var label = document.createElement('label'); 
        $(label).append('Image Caption'); 

        var input = document.createElement('input'); 
        input.type = "text"; 
        input.name = "title"; 
        input.value = ""; 

        var button = document.createElement('button'); 
        $(button).append('Upload'); 
        $(form).append(img);  
        $(form).append(input);    
        $(form).append(button);    

        $('#uploads').append(form); 
       }); 
      }); 

      e.preventDefault(); 
      e.stopPropagation(); 

     }); 

     $('#upload-all').on('click', function(e){ 
      e.preventDefault();  
      var formData = new FormData($(this)[0]);  
      $('form').each(function(i){ 
      var title = $(this).find('input').val(); 
      formData.append('file[]', fileList[i]); 
      formData.append('title[]', title); 
     }); 

     upload(formData); 
}); 

function upload(data) { 

    var xhr = new XMLHttpRequest(); 
    xhr.open('post', 'upload.php', true); 
    xhr.send(data); 

} 

     $(document).on('submit', 'form', function(e){ 
      e.preventDefault(); 
      //var index what does this do? 
      var index = $(this).index(); 
      var formData = new FormData($(this)[0]); 
      formData.append('file', fileList[index]); 
      var xhr = new XMLHttpRequest(); 
      xhr.open('post', 'upload.php', true); 
      xhr.send(formData); 
     }); 
    });

Мой файл шаблона загрузки является .html

<div id="droparea" class="droparea"> 
    Drop files here to upload 
</div> 
<div id="uploads"> 

</div> 
<button id="upload-all">Upload All</button>

источник

2015-06-30 08:58:28

Как ввести титры для загрузки нескольких файлов

ответ

Смежные вопросы