как правильно использовать элемент onchange для IE - PullRequest
0 голосов
/ 11 мая 2019

Для загрузки файлов я использую эту форму:

<div id="drop_file_zone" ondrop="upload_file(event)" ondragover="return false">
  <div id="drag_upload_file">                                               
    <p>DROP FILE(S) HERE</p>
    <p>or</p>

    <p><input class="browse btn" type="button" id="browse" value="Browse" onclick="file_explorer();"></p>
    <input type="file" id="selectfile" name="upload" multiple>

   </div>
</div>

Эта часть JS

 function file_explorer() {

        document.getElementById('selectfile').click();
        document.getElementById('selectfile').onchange = function() {
            for (var i=0; i< this.files.length;i++){ // multiple files uploading
              fileobj = document.getElementById('selectfile').files[i];
              ajax_file_upload(fileobj);
            }
        };

    }

Загрузка работает в любом браузере, кроме IE. Я уже выяснил, что есть проблема с IE и onchange.

Есть ли способ переписать функцию file_explorer, чтобы она также работала в IE без проблем?

1 Ответ

0 голосов
/ 13 мая 2019

Попробуйте использовать метод JavaScript для присоединения функции ondrop, измените код, как показано ниже:

<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
        function myFunction() {
            document.getElementById('selectfile').ondrop = function () {                    
                document.getElementById('selectfile').click();
                document.getElementById('selectfile').onchange = function () {
                    for (var i = 0; i < this.files.length; i++) { // multiple files uploading
                        fileobj = document.getElementById('selectfile').files[i];
                        //ajax_file_upload(fileobj);
                    }
                };
            };
        };
    </script>
</head>
<body onload="myFunction()">
    <div id="drop_file_zone" ondragover="return false">
        <div id="drag_upload_file">
            <p>DROP FILE(S) HERE</p>
            <p>or</p>

            <p><input class="browse btn" type="button" id="browse" value="Browse" onclick="file_explorer();"></p>
            <input type="file" id="selectfile" name="upload" multiple>

        </div>
    </div>
</body>
...