Как ОТВЕЧАТЬ на событие щелчка по типу ввода = файлу в браузерах, отличных от IE

Итак, вот сценарий-

В отличие от 3000 других вопросов на StackOverflow о том, как ВЫЗВАТЬ событие click для элемента input[type=file], я просто хочу ответить на него. Я ищу что-то вроде:

<input id="theFile" onclick="var that=this;setTimeout(function(){if(that.value){postTheForm();}}),0);" />

Я не пытаюсь вызвать click() для элемента, я просто хочу знать, когда кто-то выбрал файл, чтобы мы могли отправить форму. В IE это работает так, как ожидалось, потому что диалоговое окно файла приостанавливает поток javascript до тех пор, пока пользователь не нажмет «Открыть» или «Отмена» в диалоговом окне. В FireFox кажется, что диалог не спит поток, и анонимная функция срабатывает немедленно - даже когда диалог все еще активен.

Я подумал, могу ли я использовать событие onchange или что-то еще в FireFox для имитации поведения IE, но пока мне не повезло. Любые идеи относительно того, как я могу выполнить код ПОСЛЕ того, как пользователь нажимает «Открыть» или «Отмена» в диалоговом окне?


javascript file input file-upload firefox
person mhildreth    schedule 02.03.2011    source источник
comment
вы можете сфокусировать элемент управления, а затем, когда диалоговое окно будет закрыто, вы можете ответить на событие размытия элемента управления загрузкой файла. Смотрите мой ответ ниже.   -  person The Muffin Man    schedule 02.03.2011

Ответы (3)


arrow_upward
0
arrow_downward

используйте 1_

person Detect    schedule 02.03.2011
comment
ВОТ ЭТО ДА! Я только что понял, что мой тестовый пример для этого был испорчен, и я неправильно подключил обработчик событий, когда запускал этот тестовый пример. Я тестировал это в FF3.6, IE9, IE6 и Chrome, и это работает во всех них. Не могу поверить, что совершил такую ​​глупую ошибку. Спасибо! - person mhildreth; 03.03.2011
comment
Пожалуйста. Я люблю, когда самое простое решение действительно РАБОТАЕТ! - person Detect; 03.03.2011

arrow_upward
1
arrow_downward

Когда вы нажимаете на загрузку файла, скажите jQuery, чтобы сфокусировать его, когда вы выберете файл и нажмете открыть/отменить, он потеряет фокус, также известный как blur.

$(function() {
    $("#fileUpload").click(function() {
        $(this).focus();
    });
    $("#fileUpload").blur(function() {
        alert("blurred");
    });
});

Я тестировал это в хроме.

person The Muffin Man    schedule 02.03.2011

arrow_upward
0
arrow_downward

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

$('input:file').click(function() {
  var file = this, form = this.form, val = this.value, interval;
  function checkValue() {
    if (file.value !== val) {
      cancelInterval(interval);
      form.submit();
    }
  }
  interval = setInterval(checkValue, 100);
});

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

изменить это предполагает, что событие "изменить" действительно не работает для вас; У меня сейчас нет Firefox, чтобы посмотреть.

person Pointy    schedule 02.03.2011