Iframes больше не требуется для загрузки файлов через ajax. Я недавно сделал это сам. Проверьте эти страницы:
Использование загрузки файлов HTML5 с помощью AJAX и jQuery
http://dev.w3.org/2006/webapi / FileAPI / # FileReader-interface
Обновил ответ и очистил его. Используйте функцию getSize для проверки размера или использования функции getType для проверки типов. Добавлен progressbar html и код css.
var Upload = function (file) {
this.file = file;
};
Upload.prototype.getType = function() {
return this.file.type;
};
Upload.prototype.getSize = function() {
return this.file.size;
};
Upload.prototype.getName = function() {
return this.file.name;
};
Upload.prototype.doUpload = function () {
var that = this;
var formData = new FormData();
// add assoc key values, this will be posts values
formData.append("file", this.file, this.getName());
formData.append("upload_file", true);
$.ajax({
type: "POST",
url: "script",
xhr: function () {
var myXhr = $.ajaxSettings.xhr();
if (myXhr.upload) {
myXhr.upload.addEventListener('progress', that.progressHandling, false);
}
return myXhr;
},
success: function (data) {
// your callback here
},
error: function (error) {
// handle error
},
async: true,
data: formData,
cache: false,
contentType: false,
processData: false,
timeout: 60000
});
};
Upload.prototype.progressHandling = function (event) {
var percent = 0;
var position = event.loaded || event.position;
var total = event.total;
var progress_bar_id = "#progress-wrp";
if (event.lengthComputable) {
percent = Math.ceil(position / total * 100);
}
// update progressbars classes so it fits your code
$(progress_bar_id + " .progress-bar").css("width", +percent + "%");
$(progress_bar_id + " .status").text(percent + "%");
};
Как использовать класс загрузки
//Change id to your id
$("#ingredient_file").on("change", function (e) {
var file = $(this)[0].files[0];
var upload = new Upload(file);
// maby check size or type here with upload.getSize() and upload.getType()
// execute upload
upload.doUpload();
});
Progressbar html code
0%
Progressbar css code
#progress-wrp {
border: 1px solid #0099CC;
padding: 1px;
position: relative;
height: 30px;
border-radius: 3px;
margin: 10px;
text-align: left;
background: #fff;
box-shadow: inset 1px 3px 6px rgba(0, 0, 0, 0.12);
}
#progress-wrp .progress-bar {
height: 100%;
border-radius: 3px;
background-color: #f39ac7;
width: 0;
box-shadow: inset 1px 1px 10px rgba(0, 0, 0, 0.11);
}
#progress-wrp .status {
top: 3px;
left: 50%;
position: absolute;
display: inline-block;
color: #000000;
}
Нарезка не ограничена - проверяется встроенными типами. И хотя оба ваших примера, похоже, имеют одинаковый результат, они работают по-другому; попробуйте их со списком.
Вы в основном ответили на свой вопрос. Нарезка за пределами последовательности (по крайней мере для встроенных) не вызывает ошибки. Это имеет смысл, когда вы об этом думаете. Индексирование возвращает один элемент, но нарезка возвращает подпоследовательность элементов. Поэтому, когда вы пытаетесь индексировать несуществующее значение, ничего не вернуть; но когда вы вырезаете последовательность за пределами границ, вы все равно можете вернуть пустую последовательность.
Также обратите внимание, что есть различие между x[3]
и x[3:4]
. Например:
>>> [0, 1, 2, 3, 4, 5][3]
3
>>> [0, 1, 2, 3, 4, 5][3:4]
[3]
Причина, по которой они выглядят одинаково в случае строк, заключается в том, что не существует такой вещи, как отдельный символ за пределами строки; один символ - это всего лишь 1-символьная строка.
None
вместо ошибки - это обычное соглашение Python, когда вам нечего возвращать.
– Mark Ransom
29 February 2012 в 00:30
None
в этом случае будет сложнее рассказать между индексом вне пределов и значением None
внутри списка. Но даже если для этого было обходным путем, мне остается ясным, что возвращение пустой последовательности - это правильная вещь, когда нужно давать срезанный срез. Это аналогично выполнению объединения двух непересекающихся множеств.
– senderle
29 February 2012 в 00:49
None
в списке.
– Mark Ransom
29 February 2012 в 00:53