項(xiàng)目中會經(jīng)常用到AJAX無刷新上傳圖片,但是iframe上傳和flash插件都是比較復(fù)雜的,所以就找了一個(gè)jquery的插件。
代碼如下
使用方法如下
<script type="text/javascript">$(function () {var button = $('#upload');new AjaxUpload(button, {action: '/upload/imagesAjaxUpload',name: 'upload',onSubmit: function (file, ext) {if (!(ext && /^(jpg|jpeg|JPG|JPEG)$/.test(ext))) {alert('圖片格式不正確,請選擇 jpg 格式的文件!', '系統(tǒng)提示');return false;}// change button text, when user selects filebutton.text('上傳中');// If you want to allow uploading only 1 file at time,// you can disable upload buttonthis.disable();// Uploding -> Uploading. -> Uploading...interval = window.setInterval(function () {var text = button.text();if (text.length < 10) {button.text(text + '...');} else {button.text('上傳中');}}, 200);},onComplete: function (file, response) {window.clearInterval(interval);// enable upload buttonthis.enable();var json = eval('(' + response + ')');button.text('選擇文件');$(".qr").css("display","inline");$(".qr>img").attr("src",json.file_name);$("input[name='wechat_qr']").val('/uploads/qr/'+json.file_name);//alert(json.file_name);//$("#ajaximg").html("<img src='/uploads/qr/"+json.file_name+"' />");//$("#wechat_qr").val('/uploads/qr/'+json.file_name);}});});</script>以上所述是小編給大家介紹的使用jQuery ajaxupload插件實(shí)現(xiàn)無刷新上傳文件,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時(shí)回復(fù)大家的。在此也非常感謝大家對武林網(wǎng)網(wǎng)站的支持!
新聞熱點(diǎn)
疑難解答