html5htmlfileinternet-explorerinputfilepath

Как отключить текстовое поле ввода файла в IE?

просмотры: 20.9K

Можно ли запретить пользователю вводить текст в текстовое поле ввода файла в IE? Причина, по которой я спрашиваю, заключается в том, что если пользователь вводит текст, который не похож на путь к файловой системе (например, не начинается с чего-то вроде c: ...), тогда, когда пользователь нажимает кнопку отправки, ничего не произойдет.

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

Я обнаружил, что здесь был задан тот же вопрос без ответа: http://www.webmasterworld.com/html/3290988.htm

И этот человек придумал хак, которым я могу воспользоваться, если нет другого подходящего ответа: http://www.shauninman.com/archive/2007/09/10/styling_file_inputs_with_css_and_the_dom

РЕДАКТИРОВАТЬ: Чтобы уточнить - если пользователь вводит «не путь к файлу» в текстовом поле рядом с кнопкой «Обзор» и нажимает «Отправить», в IE ничего не произойдет. Форма не будет отправлена ​​- IE не позволяет отправлять форму, если в поле <input type = "file"> нет реального пути к файлу.

Источник

Ответов (9)

Решение

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

<input type="file" name="inputFile">
<input type="button" onclick="if(fileHasValidPath()) { submitForm(); }" value="Submit">

function fileHasValidPath() {
  if (isIE()) {
    var inputFile = document.forms[0].inputFile;
    if (inputFile.value != "" && /^(\w:)|(\\)/.test(inputFile.value)) {
      alert("File is not a valid file.  Please use the Browse button to select a file.");
      inputFile.select();
      inputFile.focus();
      return false;
    }
  }

  return true;
}

function submitForm() {
  document.forms[0].submit();
}

Я понимаю, что для файла все еще должна быть проверка на стороне сервера, но это только для того, чтобы пользователь не нажимал кнопку «Отправить» и ничего не видел. Также предполагается, что IE использует ОС Windows.

Источник

Нашел вариант, решающий вашу проблему. Возможен contentEditable следующий вариант:

<input type="file" name="name" contentEditable="false"/>
Источник

Вот демонстрация contentEditable варианта:

<input type="file" name="name" contentEditable="false" />
Источник

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

Однако вам, вероятно, лучше просто проверить содержимое файла на стороне сервера и вернуть клиенту соответствующую ошибку.

Источник

Это может быть плохой идеей для начала. Что делать, если пользователь не использует ОС Windows и хочет загрузить файл /home/user/example.txt?

Этот тип проверки может быть лучше реализован на стороне сервера.

Источник

Не могли бы вы использовать 

<input ... disabled>

РЕДАКТИРОВАТЬ : нет, на самом деле это также предотвращает отправку ... но, по-видимому, в HTML 4

<input ... readonly>

должно сработать. http://htmlhelp.com/reference/html40/forms/input.html

Источник

Как насчет этого? Вы не можете ввести или щелкнуть правой кнопкой мыши и вставить.

<input type="file" name="file" onKeyDown="this.blur()" onContextMenu="return false;">
Источник

свойство value элемента input type = file доступно только для чтения из соображений безопасности. Вы можете прочитать это свойство и сделать проверку. Если это не соответствует вашим правилам, вы сделаете предупреждение и позволите человеку изменить его. В противном случае используйте свойство externalHTML, которое переопределит его. например: элемент входного файла HTML с именем objInputFileElement. objInputFileElement.outerHTML = "";

Источник

Я основал свое решение на этой теме .

Итак, учитывая это поле файла:

<input type="file" id="file_field">

Я заставил его работать с чем-то вроде этого в jquery:

$(document).ready( function() {
    $('#file_field').bind("keydown", function(e) {
        e.preventDefault();
    });
});

Примечание: Вы должны использовать KeyDown вместо нажатия клавиши , поскольку он охватывает DEL и BACKSPACE, а также любой клавиши печати.

Источник