Загрузить файл через AJAX используя PHP

@ychelovek · Регистрация: 31.03.2013

Студворк — интернет-сервис помощи студентам

В общем... Есть html код

HTML5
1
<input type="file" name="userfile" id="userfile"><input type=button onClick="send();" value="Загрузить">

Если я обвернул бы это все в форму и в action прописал мой файл upload.php то все бы было отлично и страница ПЕРЕЗАГРУЗИЛАСЬ бы и выдало сообщение Файл загружен (ну это прописано в пхп файле echo 'Файл загружен'

Так вот. Я хочу используя AJAX сделать тоже самое...
В пхп обращение к файлу происходит с помощью $_FILES['userfile']
например проверка на размер файла выглядит так:

PHP
1
if($_FILES['userfile']['size'] != 0 and $_FILES['userfile']['size']<=600000)

Пробовал JQuery вот так:

JavaScript
1
2
3
4
5
6
7
function send() {
fileName = $("#userfile").files[0]
$.post("upload.php", { userfile: fileName },
function(data){
alert("Data Loaded: " + data);
});
}

Но ничего не получается...
Пробовал в php вместо 'userfile' писать $_POST['userfile'] - безуспешно. Помогите пожалуйста. Все эти супер навороченные в кучу строк скрипты меня не устраивают - я хочу знать как скрипт работает, а не тупо его юзанул и все...

P.S. Мне обязательно надо вывести то, что ответил php файл (ну я сделал echo 'загружено' и мне хочется это получить)

@MVS76 · 25.07.2014, 18:25

вам нужно использовать плагин http://jquery.malsup.com/form/#file-upload

@ychelovek · 25.07.2014, 18:40 **[ТС]**

MVS76, ну скажите, как будто нельзя прописать в несколько строк код, что бы передать информацию о файле пхп файлу, а он уже с ним разберется? Мне всякая анимация загрузки не нужна, мне нужно просто передать файл серверу и все... Ну а сервер с помощью массива $_FILES уже работает с ним... Спасибо конечно, если ничего не найду наверно придется пробовать ваше...

@MVS76 · 25.07.2014, 18:57

вот с плагином, другого Я не знаю:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<html>
    <head>
        <title>Загрузка файлов на сервер PHP и jQuery. Scriptland.com.ua</title>
        <script src="/jquery.min.js"></script>
        <script src="/js/jquery.form.js"></script>
 
    </head>
<body>
    <form id="formUpload" method="post" enctype="multipart/form-data" action="/upload.php">
        <input type="file" name="file" id="file" />
        <div id="preview"></div>
    </form>
 
</body>
</html>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
<script type="text/javascript">
        // Загружаем файл
        $(document).ready(function() { 
            $(document).on('change', '#file', function() { 
                $("#preview").html(''); // чистим preview. Кстати я не знаю для чего его чистить, следующая строка его сама подчистит. 
                $("#preview").html('<img src="load.gif" alt="JavaScript: Загрузка картинок с помощью jQuery и PHP" />'); //показываем картинку загрузки
                $("#formUpload").ajaxForm({
                    target: '#preview'
                }).submit();
            });
        }); 
    </script>

Новые блоги и статьи Все статьи Все блоги /
PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Access VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.	Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .	Ломающие изменения в C#.NStar Alpha Etyuhibosecyu 20.11.2025 Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .	Мысли в слух kumehtar 18.11.2025 Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .	Создание Single Page Application на фреймах krapotkin 16.11.2025 Статья исключительно для начинающих. Подходы оригинальностью не блещут. В век Веб все очень привыкли к дизайну Single-Page-Application . Быстренько разберем подход "на фреймах". Мы делаем одну. . .

@MVS76 Не мoдepaтор 340 / 315 / 94 Регистрация: 07.07.2012 Сообщений: 1,040 Записей в блоге: 7
	25.07.2014, 18:25
	вам нужно использовать плагин http://jquery.malsup.com/form/#file-upload 0

@ychelovek 13 / 13 / 3 Регистрация: 31.03.2013 Сообщений: 287
	25.07.2014, 18:40 [ТС]
	MVS76, ну скажите, как будто нельзя прописать в несколько строк код, что бы передать информацию о файле пхп файлу, а он уже с ним разберется? Мне всякая анимация загрузки не нужна, мне нужно просто передать файл серверу и все... Ну а сервер с помощью массива $_FILES уже работает с ним... Спасибо конечно, если ничего не найду наверно придется пробовать ваше... 0

Загрузить файл через AJAX используя PHP

Решение