Местоположение пути возврата для файла в Javascript / HTML - PullRequest
0 голосов
/ 16 февраля 2020

Да, я пытаюсь перетащить файл в браузер. Затем я хотел бы взять путь к этому файлу и присвоить его некоторой переменной в моем JS коде.

Ниже приведена моя неудачная попытка заставить его работать. Пожалуйста, покажите мне пример для достижения этой цели.

<body>

<script>
function handleFileSelect(evt) {
    evt.stopPropagation();
    evt.preventDefault();
    output = [];
    var source = evt.dataTransfer.files();
    for (i=0, f; f=source[i], i++){
        outpush.push(source[i])
    }
    console.log(outpush[0]);
}

window.addEventListener("dragover",function(e){
  e = e || event;
  e.preventDefault();
},false);

window.addEventListener("drop",function(e){
  e = e || event;
  e.preventDefault();
  handleFileSelect(e);
},false);
</script>


</body>
</html>

1 Ответ

0 голосов
/ 16 февраля 2020

Проблемы

  • evt.dataTransfer.files() не является функцией. Его следует заменить на evt.dataTransfer.items.
  • Ваш для l oop недействителен, его следует изменить с

    for (i=0, f; f=source[i], i++){
        outpush.push(source[i])
    }
    

    ... to ...

    for (i=0; i < evt.dataTransfer.items.length; i++){
        output.push(source[i]);
    }
    
    • Недопустимая часть в скобках для l oop.
    • Вы пытаетесь добавить файл в outpush, что не существует. Вы должны добавить файл в массив output, который вы создали.
  • Невозможно получить путь к файлу, так как JavaScript не имеет доступа к хосту компьютер (по соображениям безопасности). Вы по-прежнему можете управлять файлом, используя source[index].getAsFile().

Исправленный код

, который я предоставил jsfiddle .

<html>

<body>

  <script>
    function handleFileSelect(evt) {
      evt.stopPropagation();
      evt.preventDefault();
      output = [];
      var source = evt.dataTransfer.items;
      for (i = 0; i < evt.dataTransfer.items.length; i++) {
        output.push(source[i]);
      }
      console.log(output[0]);
    }

    window.addEventListener("dragover", function(e) {
      e = e || event;
      e.preventDefault();
    }, false);

    window.addEventListener("drop", function(e) {
      e = e || event;
      e.preventDefault();
      handleFileSelect(e);
    }, false);
  </script>


</body>

</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...