Verwenden Sie das jQuery-Plug-in, um Code zum Hochladen von Dateien ohne Aktualisierung freizugeben

AJAX wird häufig zum Hochladen von Bildern ohne Aktualisierung im Projekt verwendet, aber das Hochladen von IFrames und das Flash-Plug-In sind relativ kompliziert, daher habe ich ein JQuery-Plug-In gefunden. Im Folgenden finden Sie einen Beispielcode, der Ihnen zeigt, wie Sie mit dem jQuery-Ajaxupload-Plug-In die Funktion zum Hochladen von Dateien ohne Aktualisierung erreichen. Freunde, die es benötigen, können darauf verweisen.

AJAX lädt häufig Bilder ohne Aktualisierung hoch Wird in Projekten verwendet, aber das Hochladen von IFrames und Flash-Plug-Ins sind beides. Es war ziemlich kompliziert, also habe ich ein JQuery-Plug-In gefunden.

Der Code lautet wie folgt

Die Verwendungsmethode ist wie folgt

<script type="text/javascript">
$(function () {
var button = $(&#39;#upload&#39;);
new AjaxUpload(button, {
action: &#39;/upload/imagesAjaxUpload&#39;,
name: &#39;upload&#39;,
onSubmit: function (file, ext) {
if (!(ext && /^(jpg|jpeg|JPG|JPEG)$/.test(ext))) {
alert(&#39;图片格式不正确,请选择 jpg 格式的文件!&#39;, &#39;系统提示&#39;);
return false;
}
// change button text, when user selects file
button.text(&#39;上传中&#39;);
// If you want to allow uploading only 1 file at time,
// you can disable upload button
this.disable();
// Uploding -> Uploading. -> Uploading...
interval = window.setInterval(function () {
var text = button.text();
if (text.length < 10) {
button.text(text + &#39;...&#39;);
} else {
button.text(&#39;上传中&#39;);
}
}, 200);
},
onComplete: function (file, response) {
window.clearInterval(interval);
// enable upload button
this.enable();
var json = eval(&#39;(&#39; + response + &#39;)&#39;);
button.text(&#39;选择文件&#39;);
$(".qr").css("display","inline");
$(".qr>img").attr("src",json.file_name);
$("input[name=&#39;wechat_qr&#39;]").val(&#39;/uploads/qr/&#39;+json.file_name);
//alert(json.file_name);
//$("#ajaximg").html("<img src=&#39;/uploads/qr/"+json.file_name+"&#39; />");
//$("#wechat_qr").val(&#39;/uploads/qr/&#39;+json.file_name);
}
});
});
</script>

Das obige ist der detaillierte Inhalt vonVerwenden Sie das jQuery-Plug-in, um Code zum Hochladen von Dateien ohne Aktualisierung freizugeben. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!