Документы Google - Доступ к текстовым изменениям в реальном времени

Я рад, что браузеры хотят спасти нас от навязчивых скриптов и т. п. Я не доволен тем, что IE помещает что-то в браузер, что делает простой стиль-fix похожим на хакерскую атаку!

Я использовал & lt; span>, чтобы представить входной файл, чтобы я мог применить соответствующий стиль к & lt; div> вместо & lt; input> (еще раз, из-за IE). Теперь из-за этого IE хочет показать пользователю путь со значением, который просто гарантированно поставит их на страже и, по крайней мере, опасается (если не полностью их отпугнуть?!) ... БОЛЬШЕ IE-CRAP!

Во всяком случае, благодаря тем, кто разместил объяснение здесь: Безопасность браузера IE: добавление «fakepath» в путь к файлу во входном файле [type = «file»] , я собрал minor fixer-upper ...

Нижеприведенный код выполняет две функции: он исправляет ошибку IE8, в которой событие onChange не срабатывает до тех пор, пока поле onBlur не выведет поле и не обновит элемент с очищенным файловым пути, который не пугает пользователя.

// self-calling lambda to for jQuery shorthand "$" namespace
(function($){
    // document onReady wrapper
    $().ready(function(){
        // check for the nefarious IE
        if($.browser.msie) {
            // capture the file input fields
            var fileInput = $('input[type="file"]');
            // add presentational  tags "underneath" all file input fields for styling
            fileInput.after(
                $(document.createElement('span')).addClass('file-underlay')
            );
            // bind onClick to get the file-path and update the style 

            fileInput.click(function(){
                // need to capture $(this) because setTimeout() is on the
                // Window keyword 'this' changes context in it
                var fileContext = $(this);
                // capture the timer as well as set setTimeout()
                // we use setTimeout() because IE pauses timers when a file dialog opens
                // in this manner we give ourselves a "pseudo-onChange" handler
                var ieBugTimeout = setTimeout(function(){
                    // set vars
                    var filePath     = fileContext.val(),
                        fileUnderlay = fileContext.siblings('.file-underlay');
                    // check for IE's lovely security speil
                    if(filePath.match(/fakepath/)) {
                        // update the file-path text using case-insensitive regex
                        filePath = filePath.replace(/C:\\fakepath\\/i, '');
                    }
                    // update the text in the file-underlay 
                    fileUnderlay.text(filePath);
                    // clear the timer var
                    clearTimeout(ieBugTimeout);
                }, 10);
            });
        }
    });
})(jQuery);