Javascript не очищает окно в IE

Question

Internet Explorer, проклятие моей жизни при разработке, снова отказывается делать то, что другие браузеры делают легко. Я пытаюсь очистить код / ​​значение просмотра, если пользователь выбирает недопустимый тип файла. Работает в FF, но не в IE 9. Спасибо

<script type="text/javascript">
<!--
    extArray = new Array(".jpg", ".png");
    function LimitAttach(form, file) {
        allowSubmit = false;
        if (!file) return;
        while (file.indexOf("\\") != -1)
            file = file.slice(file.indexOf("\\") + 1);
            ext = file.slice(file.indexOf(".")).toLowerCase();
        for (var i = 0; i < extArray.length; i++) {
            if (extArray[i] == ext) { 
                allowSubmit = true; 
                break; 
            }
        }
        if (allowSubmit) {
            return true;
        } else {
            alert("Please only upload files that end in types:  "
            + (extArray.join("  ")) + "\nPlease select a new "
            + "file to upload and submit again.");
            document.getElementById('photobrowser').value = "";
            return false;
        }
    }
-->
</script>


    <form action="process.php" method="POST" enctype="multipart/form-data" name="formUpload">
        <label>Picture:</label>
        <input type="file" name="photo" id="photobrowser" onchange="return LimitAttach(formUpload, formUpload.photo.value)" tabindex="4">
        <input type="hidden" name="subphoto" value="<?php echo $newCount ?>" />
        <input type="image" src="styling/images/button-add-photo.png" id="subBtn" tabindex="6" />
    </form

Answer 1

Браузеры сильно различаются по своим ограничениям при вводе файлов. Ввод файлов позволяет пользователю взаимодействовать и выбирать файлы в своей файловой системе. Поэтому все браузеры ограничивают JS от автоматического выбора файлов. IE идет дальше, чтобы вообще запретить изменять выбор ввода, даже на пустую строку. Это действительно имеет смысл, поскольку, если вы не разрешаете выбор данного файла, почему вам вообще следует разрешить его изменение?

И вместо того, чтобы проверять его в JS, вы должны проверять файлы на сервере. Проверка внешнего интерфейса удобна для простоты использования, но даже когда она есть, всегда должна быть проверка внутреннего интерфейса. Пользователи могут просто отключить JS, использовать что-то вроде firebug для его изменения или даже (иногда) загрузить файл на свой локальный компьютер, изменить его, а затем использовать для отправки на ваш сайт.

Answer 2

Вы пытались передать this в метод JS вместо того, чтобы найти его по идентификатору?:

onchange="return LimitAttach(this, this.value);"

JavaScript:

function LimitAttach(input, file) {  
    allowSubmit = false;  
    if (!file) return;  
    while (file.indexOf("\\") != -1)  
        file = file.slice(file.indexOf("\\") + 1);  
        ext = file.slice(file.indexOf(".")).toLowerCase();  
    for (var i = 0; i < extArray.length; i++) {  
        if (extArray[i] == ext) {   
            allowSubmit = true;   
            break;   
        }  
    }  
    if (allowSubmit) {  
        return true;  
    } else {  
        alert("Please only upload files that end in types:  "  
        + (extArray.join("  ")) + "\nPlease select a new "  
        + "file to upload and submit again.");  
        input.value = "";  
        return false;  
    }  
}

EDIT

Это что-то вроде хака, но вы можете попробовать его:

function checkImg(val){
  var dgr = val.value;
  dgr = dgr.substr(dgr.length-4, dgr.length)
  dgr = dgr.toLowerCase();
  if (dgr =='.jpg' || dgr == 'jpeg' || dgr== '.gif'){
     alert('image');
  }else{
     alert('not image');
     var objD = document.forms['form1'].divR;
     objD.innerHTML = '';
     objD.innerHTML = '<input id="uImg" name="uImg" type="file" class="defText" style="font-size: 10pt" onchange="javascript: checkImg(this);" size="30">';
  }
}

<form name="form1" id="form1" method="post">
  <div id="divR" name="divR">
    <input id="uImg" name="uImg" type="file" class="defText" style="font-size: 10pt" onchange="javascript: checkImg(this);" size="30">
  </div>
</form>