Plupload 前端预览大图片导致网页崩溃

目前整个项目后台是javaSSM框架,前端利用plupload进行图片上传、上传服务器前会进预览显示
代码如下:利用mOxie对象进行预览,上传小图片时预览没有任何问题,但是当一次性上添加多张10M左右图片时,其中几张会预览出来,然后接着网页就会崩溃了,,求帮忙

图片说明

3个回答

10M的图片也太大了一点,一般数码相机、手机拍摄的也就几兆。

http://www.plupload.com/docs/v2/Image-Resizing-on-Client-Side
官方文档说了

Obviously client-side and specifically browser environment cannot be as powerful (not yet at least) as the server-side might be. So somewhere there must be a limitation on the resolution that might be handled in the browsers or their add-ons. We assume it to be 6500 by 6500 pixels (about 42MP). I say assume, because there's no way to figure out the actual top line or detect when browser (or its add-on) runs out of memory - if this happens it simply hangs (the best case). So we came up with the safe margin, where browser can still reliably operate (read - breathe) and if either side of the image is larger than that margin, Plupload will simply bail out and upload the image as is, without any tampering.

最大不超过6500x6500像素,否则会内存溢出。

ai_bao_zi
咕噜是个大胖子 看了下翻译,说是超出边界,则不会进行任何修改原样上传,这个满足了我的第二个疑问,第一个疑问的话,可能还要去想其它办法解决了,谢谢
2 年多之前 回复
另外发现一个问题,针对10M一下的图片,会进行压缩预览,而10M以上的感觉根本就没有进行过压缩一样?

![图片说明](https://img-ask.csdn.net/upload/201801/05/1515142896_870147.png)

图片说明

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
plupload在ie8上不显示预览图片

预览方法如下: enter code here function previewImage(file,callback){//file为plupload事件监听函数参数中的file对象,callback为预览图片准备完成的回调函数 if(!file || !/image\//.test(file.type)) return; //确保文件是图片 if(file.type=='image/gif'){//gif使用FileReader进行预览,因为mOxie.Image只支持jpg和png var fr = new mOxie.FileReader(); fr.onload = function(){ callback(fr.result); fr.destroy(); fr = null; } fr.readAsDataURL(file.getSource()); }else{ var preloader = new mOxie.Image(); preloader.onload = function() { preloader.downsize( 300, 300 );//先压缩一下要预览的图片,宽300,高300 var imgsrc = preloader.type=='image/jpeg' ? preloader.getAsDataURL('image/jpeg',80) : preloader.getAsDataURL(); //得到图片src,实质为一个base64编码的数据 callback && callback(imgsrc); //callback传入的参数为预览图片的url preloader.destroy(); preloader = null; }; preloader.load( file.getSource() ); } }

Plupload以不同的尺寸保存每个图像

<div class="post-text" itemprop="text"> <p>I'm using Plupload to upload images to the server. But I would like to save each image in the original way but also as a thumbnail.</p> <p>That's my code:</p> <pre><code>$(function() { $("#uploader").plupload({ // Allgemeine Einstellungen runtimes : 'html5,flash,silverlight,html4', url : 'Uploader/examples/upload.php', // Datei führt Upload aus // max. Anzahl von Dateien max_file_count: 10, chunk_size: '1mb', // Materialien skalieren, um Ladekapazität der App nicht zu überschreiten // Zitat des Docs: "obviously resize is not the best name for the option, since currently we can only downsize" // http://www.plupload.com/docs/Image-Resizing-on-Client-Side resize : { width : 2000, height : 2000, quality : 100, preserve_headers: false, // Header von jpg Dateien löschen crop: false // crop deaktivieren, damit das Bild gesamt bleibt }, filters : { // max. Dateigröße max_file_size : '100mb', // Dateitypen (Bilder und Videos) mime_types: [ {title : "Image files", extensions : "jpg,jpeg,gif,png"}, //Bidler {title : "Video files", extensions : "mov,mp4,m4v"} // Videos (werden von iOS unterstützt) ] }, // Nutzer kann die Bilder nicht manuell umbenennen rename: false, // Nutzer kann Dateien sortieren sortable: true, // Die abgespeicherten Daten haben einmalige Namen unique_names:true, // Der Nutzer kann nicht manuell den Upload starten - Button deaktiviert buttons:{start:false}, // DragDrop Feature (currently only HTML5 supports that) dragdrop: true, // Views to activate views: { list: true, thumbs: true, // Show thumbs active: 'thumbs' }, // Alternative , falls Browser nicht unterstützt wird // Flash settings flash_swf_url : 'Uploader/js/Moxie.swf', // Silverlight settings silverlight_xap_url : 'Uploader/js/Moxie.xap', </code></pre> <p>Is there a easy way to achieve this? Unfortunately Plupload doesn't provide such a functionality </p> <p>Thanks Chris</p> </div>

这样写前端图片上传组件,还缺什么吗?为何404

遇到一个问题。两天了没解决。就是上传图片404。 这是编辑/新增页面上传图片的代码,共两张,代码一样 ![图片说明](https://img-ask.csdn.net/upload/201811/20/1542725301_424547.png) 这是上图中“onePicUpload”指向的上传组件 ![图片说明](https://img-ask.csdn.net/upload/201811/20/1542725360_168548.png) 视频教程中前端关于上传功能的代码只有这两个没别的,视频中上传成功 ![图片说明](https://img-ask.csdn.net/upload/201811/20/1542725430_323271.png) 我照着敲,至今没找到不同,因为前端完全是复制来的 但是在上传的时候: ![图片说明](https://img-ask.csdn.net/upload/201811/20/1542725514_792802.png)

加载时PLupload图像顺序

<div class="post-text" itemprop="text"> <p>First question here and I apologize in advance if my research wasnt thorough enough.</p> <p>I am using PLupload to retrieve images from my server which it does fine, my problem is showing them in the order in which they were uploaded. The image order while retrieving is important as it is a fundamental part of the application.</p> <p>Here is my code so far to retrieving:</p> <pre><code>ready: function() { plupload = $("#uploader").plupload('getUploader'); var files = new Array(); $.get('data/funcs/retrieve.php', function(data) { &lt;?php foreach($images as $key =&gt; $val){ ?&gt; files.push('&lt;?php echo $val; ?&gt;'); &lt;?php } ?&gt; files.forEach(function(entry) { var img = new mOxie.Image(); var url = o.resolveUrl(entry); img.onload = function() { plupload.addFile(img.getAsBlob()); } //end image onload img.load(url); }); for(var i = 0, upPreviousSize = plupload.files.length - files.length, size = files.length; i &lt; size; i++) { files[i]["initialIndex"] = (i + upPreviousSize) * -1; } }); </code></pre> <p>Any help will be greatly appreciated.</p> </div>

Plupload上传文件名问题

<div class="post-text" itemprop="text"> <p>I have been successful in <a href="http://www.plupload.com/punbb/viewtopic.php?id=28" rel="nofollow noreferrer">porting over plupload into Codeigniter</a>, but when a user uploads a file, the filename comes out like this: _1, _2, _3, etc.</p> <p>What could be causing this error?</p> <p>Here is my CodeIgniter Controller:</p> <pre><code>function do_upload($fileName) { // Settings $targetDir = getcwd() . "/uploads/"; $cleanupTargetDir = false; // Remove old files $maxFileAge = 60 * 60; // Temp file age in seconds // 5 minutes execution time @set_time_limit(5 * 60); // usleep(5000); // Get parameters $chunk = isset($_REQUEST["chunk"]) ? $_REQUEST["chunk"] : 0; $chunks = isset($_REQUEST["chunks"]) ? $_REQUEST["chunks"] : 0; // Clean the fileName for security reasons $fileName = preg_replace('/[^\w\._]+/', '', $fileName); // Create target dir if (!file_exists($targetDir)) @mkdir($targetDir); // Remove old temp files if (is_dir($targetDir) &amp;&amp; ($dir = opendir($targetDir))) { while (($file = readdir($dir)) !== false) { $filePath = $targetDir . DIRECTORY_SEPARATOR . $file; // Remove temp files if they are older than the max age if (preg_match('/\\.tmp$/', $file) &amp;&amp; (filemtime($filePath) &lt; time() - $maxFileAge)) @unlink($filePath); } closedir($dir); } else die('{"jsonrpc" : "2.0", "error" : {"code": 100, "message": "Failed to open temp directory."}, "id" : "id"}'); // Look for the content type header if (isset($_SERVER["HTTP_CONTENT_TYPE"])) $contentType = $_SERVER["HTTP_CONTENT_TYPE"]; if (isset($_SERVER["CONTENT_TYPE"])) $contentType = $_SERVER["CONTENT_TYPE"]; if (strpos($contentType, "multipart") !== false) { if (isset($_FILES['file']['tmp_name']) &amp;&amp; is_uploaded_file($_FILES['file']['tmp_name'])) { // Open temp file $out = fopen($targetDir . DIRECTORY_SEPARATOR . $fileName, $chunk == 0 ? "wb" : "ab"); if ($out) { // Read binary input stream and append it to temp file $in = fopen($_FILES['file']['tmp_name'], "rb"); if ($in) { while ($buff = fread($in, 4096)) fwrite($out, $buff); } else die('{"jsonrpc" : "2.0", "error" : {"code": 101, "message": "Failed to open input stream."}, "id" : "id"}'); fclose($out); unlink($_FILES['file']['tmp_name']); } else die('{"jsonrpc" : "2.0", "error" : {"code": 102, "message": "Failed to open output stream."}, "id" : "id"}'); } else die('{"jsonrpc" : "2.0", "error" : {"code": 103, "message": "Failed to move uploaded file."}, "id" : "id"}'); } else { // Open temp file $out = fopen($targetDir . DIRECTORY_SEPARATOR . $fileName, $chunk == 0 ? "wb" : "ab"); if ($out) { // Read binary input stream and append it to temp file $in = fopen("php://input", "rb"); if ($in) { while ($buff = fread($in, 4096)) fwrite($out, $buff); } else die('{"jsonrpc" : "2.0", "error" : {"code": 101, "message": "Failed to open input stream."}, "id" : "id"}'); fclose($out); } else die('{"jsonrpc" : "2.0", "error" : {"code": 102, "message": "Failed to open output stream."}, "id" : "id"}'); } // Return JSON-RPC response die('{"jsonrpc" : "2.0", "result" : null, "id" : "id"}'); } </code></pre> <p>External Links:<br> <a href="http://codeigniter.com" rel="nofollow noreferrer">CodeIgniter</a><br> <a href="http://www.plupload.com" rel="nofollow noreferrer">Plupload</a> </p> </div>

plupload提交队列完成

<div class="post-text" itemprop="text"> <p>Using plupload jquery queue plugin as in <a href="http://www.plupload.com/example_queuewidget.php" rel="nofollow">this example</a>, how can I submit the form on upload complete? I attempted to add a <code>&lt;input type="submit" /&gt;</code> button, and click this button without first clicking the <code>Start upload</code>. This triggers the <code>uploader.start()</code> correctly, and then <code>$('form').submit()</code> - however the $_POST data only contains: <code>'uploader_count' =&gt; string '0' (length=1)</code>. If I first click the <code>Start upload</code> button however, the proper POST vars are populated. </p> <p>How can I trigger <code>.submit()</code> and be sure the correct file upload post parameters are present (E.G. <code>$_POST['uploader_count']</code>) ?</p> </div>

plupload怎么获取文件的目录显示在前台页面上

plupload文件实现上传功能后怎么能让图片的上传目录显示在前台页面的缩略图下方呢

plUpload与多个实例提交表单提交

<div class="post-text" itemprop="text"> <p>I have looked on here and other sites at many examples of plUpload. I have taken code from these examples and have got different forms working but none will do exactly what i'm looking for - fingers crossed you guys will help me find a solution.</p> <p>I currently have a data entry form made up of table rows with each row allowing uploading of an image. This form is submitted to PHP and the images/data stored.</p> <p>I'm wanting to move the image upload routines over to plUpload to work better with older/more browsers and allowing client image resize etc.</p> <p>From what i can see I need a mix of the core plUpload and the jQuery module to allow for instances to be bound via a class rather than an id but I went down that route and hit a brick wall. I've now been looking at another two bits of code found on here (sorry I've forgot the author name) and have come up with the below.</p> <pre><code>&lt;script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="../js/plupload.full.min.js"&gt;&lt;/script&gt; &lt;form id="form" action="" multipart method="post"&gt; &lt;div id="container1" class="gallery"&gt; &lt;a id="pickfiles1" href="javascript:;"&gt;[Select files]&lt;/a&gt; &lt;a id="uploadfiles1" href="javascript:;"&gt;[Upload files]&lt;/a&gt; &lt;/div&gt; &lt;div id="container2" class="gallery"&gt; &lt;a id="pickfiles2" href="javascript:;"&gt;[Select files]&lt;/a&gt; &lt;a id="uploadfiles2" href="javascript:;"&gt;[Upload files]&lt;/a&gt; &lt;/div&gt; &lt;input type="submit" /&gt;&lt;/input&gt; &lt;/form&gt; &lt;p&gt;&lt;label&gt;Debug data:&lt;/label&gt;&lt;div id="debug"&gt;&lt;/div&gt;&lt;/p&gt; &lt;div id="uploaded"&gt;&lt;/div&gt; &lt;script&gt; function initUploader(itemIndex) { var uploader1 = new plupload.Uploader({ runtimes: 'html5,html4,flash,silverlight,browserplus', browse_button: 'pickfiles'+itemIndex, container: 'container'+itemIndex, max_file_size: '10mb', max_retries: 3, chunk_size: '1mb', url: 'upload.php', unique_names: false, preserve_headers: false, flash_swf_url: 'http://www.plupload.com/plupload/js/plupload.flash.swf', silverlight_xap_url: 'http://www.plupload.com/plupload/js/plupload.silverlight.xap', filters: [ { title: "Image files", extensions: "jpg,gif,png"} ], resize: {width : 320, height : 240, quality : 90} }); uploader1.bind('Init', function(up, params) { $('#filelist'+itemIndex).html("&lt;div&gt;Current runtime: " + params.runtime + "&lt;/div&gt;"); }); $('#uploadfiles'+itemIndex).click(function(e) { uploader1.start(); e.preventDefault(); }); uploader1.init(); uploader1.bind('UploadProgress', function(up, file) { $('#' + file.id + " b").html(file.percent + "%"); }); uploader1.bind('Error', function(up, err) { $('#filelist'+itemIndex).append("&lt;div&gt;Error: " + err.code + ", Message: " + err.message + (err.file ? ", File: " + err.file.name : "") + "&lt;/div&gt;" ); up.refresh(); // Reposition Flash/Silverlight }); uploader1.bind('FilesAdded', function(up, files) { $.each(files, function(i, file) { $('#debug').prepend('Uploading ' + file.name + ' (' + file.size + ' bytes)'); }); // up.refresh(); // up.start(); }); uploader1.bind('FileUploaded', function(up, file) { // $('#' + file.id + " b").html("100%"); $('#uploaded').prepend('&lt;p&gt;&lt;a href="' + public_url + file.name + '" target="_blank"&gt;&lt;img src="' + public_url + file.name + '" width="100"/&gt;&lt;/a&gt;&lt;/p&gt;'); }); } $('#form').submit(function(e) { // Files in queue upload them first alert("Submit"); var uploader = $('#container2').plupload('getUploader'); // Validate number of uploaded files if (uploader.total.uploaded == 0) { // Files in queue upload them first if (uploader.files.length &gt; 0) { // When all files are uploaded submit form uploader.bind('UploadProgress', function () { $('#uploader1').on('complete', function() { alert("Complete - wait for rest"); $('#form').submit(); }); }); $('#uploader1').plupload('start'); } else { $('#form').submit();} //alert('You must at least upload one file.'); e.preventDefault(); } else { $('#form').submit();} }); initUploader(1); initUploader(2); &lt;/script&gt; </code></pre> <p>The routine will allow me to selet files but I can't submit them on form submit..</p> <p>Any help to point me in the right direction would be appreciated.</p> </div>

Plupload 上传问题,再一打开窗口怎么初始化原来存在的文件

plupload组件的初始化放在弹窗中,当第一次选择文件后,关闭弹窗,再次打开弹窗,需要清空之前选择的文件,该怎么清空?

用plupload上传图片,和struts2结合,怎么获取上传成功后action返回的数据

也就是在plupload中怎么获取后台传过来的数据,是json数据,再简单点说,怎么写 plupload中的回调函数

我正在尝试使用plupload上传视频,但我得到了奇怪的文件而不是视频文件

<div class="post-text" itemprop="text"> <p>This is a code I am using in javascript I can;t upload video files it works fine for images. there is an image of files I get after trying to upload video files</p> <p><a href="https://i.stack.imgur.com/6VXrA.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/6VXrA.png" alt="enter image description here"></a></p> <pre><code> var uploader = new plupload.Uploader({         // General settings         runtimes : 'silverlight,html4', browse_button : 'pickfiles', // you can pass in id...         url : 'upload.php',         chunk_size : '1mb',         unique_names : true,           // Resize images on client-side if we can         resize : { width : 320, height : 240, quality : 90 },                  filters : {             max_file_size : '10mb', // Specify what files to browse for                          mime_types : "image/*,application/zip,video/mp4"         },   flash_swf_url : '../js/Moxie.swf', silverlight_xap_url : '../js/Moxie.xap',                   // PreInit events, bound before the internal events         preinit : {             Init: function(up, info) {                 log('[Init]', 'Info:', info, 'Features:', up.features);             },               UploadFile: function(up, file) {                 log('[UploadFile]', file);                   // You can override settings before the file is uploaded                 // up.setOption('url', 'upload.php?id=' + file.id);                 // up.setOption('multipart_params', {param1 : 'value1', param2 : 'value2'});             }         }, </code></pre> <p>if you have any idea write anything you have in mind.</p> <p>thanks in advance</p> </div>

plupload IE8\IE9浏览器下不请求flash方法

代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>demo</title> <script src="js/jquery-1.10.2.min.js"></script> <script src="js/plupload.full.min.js"></script> <style> body{ font-size: 12px;} body,p,div{ padding: 0; margin: 0;} .wraper{ padding: 30px 0;} .btn-wraper{ text-align: center;} .btn-wraper input{ margin: 0 10px;} #file-list{ width: 350px; margin: 20px auto;} #file-list li{ margin-bottom: 10px;} .file-name{ line-height: 30px;} .progress{ height: 4px; font-size: 0; line-height: 4px; background: orange; width: 0;} .tip1{text-align: center; font-size:14px; padding-top:10px;} .tip2{text-align: center; font-size:12px; padding-top:10px; color:#b00} .catalogue{ position: fixed; _position:absolute; _width:200px; left: 0; top: 0; border: 1px solid #ccc;padding: 10px; background: #eee} .catalogue a{ line-height: 30px; color: #0c0} .catalogue li{ padding: 0; margin: 0; list-style: none;} </style> </head> <body> <div class="wraper"> <div class="btn-wraper"> <input type="button" value="选择文件..." id="browse" /> </div> <ul id="file-list"> </ul> </div> <script> var uploader = new plupload.Uploader({ //实例化一个plupload上传对象 browse_button : 'browse', url : 'upload.html', flash_swf_url : 'js/Moxie.swf', silverlight_xap_url : 'js/Moxie.xap', filters: { mime_types : [ //只允许上传图片文件 { title : "图片文件", extensions : "jpg,gif,png" } ] } }); uploader.init(); //初始化 //绑定文件添加进队列事件 uploader.bind('FilesAdded',function(uploader,files){ for(var i = 0, len = files.length; i<len; i++){ var file_name = files[i].name; //文件名 //构造html来更新UI var html = '<li id="file-' + files[i].id +'"><p class="file-name">' + file_name + '</p><p class="progress"></p></li>'; $(html).appendTo('#file-list'); !function(i){ previewImage(files[i],function(imgsrc){ $('#file-'+files[i].id).append('<img src="'+ imgsrc +'" />'); }) }(i); } }); //plupload中为我们提供了mOxie对象 //有关mOxie的介绍和说明请看:https://github.com/moxiecode/moxie/wiki/API //如果你不想了解那么多的话,那就照抄本示例的代码来得到预览的图片吧 function previewImage(file,callback){//file为plupload事件监听函数参数中的file对象,callback为预览图片准备完成的回调函数 if(!file || !/image\//.test(file.type)) return; //确保文件是图片 if(file.type=='image/gif'){//gif使用FileReader进行预览,因为mOxie.Image只支持jpg和png var fr = new mOxie.FileReader(); fr.onload = function(){ callback(fr.result); fr.destroy(); fr = null; } fr.readAsDataURL(file.getSource()); }else{ var preloader = new mOxie.Image(); preloader.onload = function() { preloader.downsize( 300, 300 );//先压缩一下要预览的图片,宽300,高300 var imgsrc = preloader.type=='image/jpeg' ? preloader.getAsDataURL('image/jpeg',80) : preloader.getAsDataURL(); //得到图片src,实质为一个base64编码的数据 callback && callback(imgsrc); //callback传入的参数为预览图片的url preloader.destroy(); preloader = null; }; preloader.load( file.getSource() ); } } </script> </body> </html>

Plupload Image上传预加载图像或以编程方式添加图像

<div class="post-text" itemprop="text"> <p>I am using Plupload to allow users to upload images in a form. I am able to successfully upload images using Plupload. My program also allows users to save the form and continue editing/posting later. Now when the user resumes the form later I want to pre-load those files in Plupload from the server. I am not sure how to implement this.</p> <p>I have been trying to implement addFile, but cannot implement. I would like to preload or add files to plupload programmatically.</p> <p>Link: <a href="http://www.plupload.com/docs/Uploader#addFile-filefileName-method" rel="nofollow">Add File Method</a> Your help would be appreciated!</p> </div>

有没有大神用过plupload实现断点续传的,急急。。。

如题,使用plupload上传控件,实现断点续传,我下载了别人一个案例,几乎是照着写了,但是还是不能断点续传,下载的DEMO可以

jquery 谁用过plupload上传 我点击开始上传 然后那个

jquery 谁用过plupload上传 我点击开始上传 然后那个 选择文件 和开始上传的按钮不见了 怎么弄 才可以 我点击上传一张 再点选择文件 在上传 这样下去

Ueditor 上传图片问题

http://192.168.1.230==>这个是图片服务器 "imageUrlPrefix": "", /* 图片访问路径前缀 */ "imagePathFormat": "/group1/M00/00/05/{yyyy}{mm}{dd}/{time}{rand:6}", /* 现在想要吧图片放到图片服务器上 求怎么设置

知道文件全路径 能否使用plupload上传

最近做一个需求 知道文件全路径 能否使用plupload上传,因为plupload自带了选择文件的控件

如何在plupload中找到新文件名

<div class="post-text" itemprop="text"> <p>I use Plupload for uploading my files. I set unique_names:true and so the files are stored with a unique file name.</p> <p>But when I the event UploadComplete or FilesAdded is called the file name is still the same as on the desktop.</p> <p>That's the code:</p> <pre><code>FilesAdded: function (up, files) { for (var i in files) { files[i].name = files[i].name.split('_').join(' ').trim(); alert('Selected files: ' + files[i].name); } }, UploadComplete: function(up, files) {                 // Called when all files are either uploaded or failed for (var i in files) { files[i].name = files[i].name.split('_').join(' ').trim(); alert('uploaded files: ' + files[i].name); }             }, </code></pre> <p>How can I find the new unique name?</p> <p>Thanks</p> </div>

Plupload自定义配置问题,有什么想法吗?

<div class="post-text" itemprop="text"> <p>I've been working for a bit on this code, making in function just as I'd like it, but in the end I guess I missed something pretty big: the files don't seem to be uploading. The progress bar has been perfectly tweaked, the dialog box works well, just no files are being uploaded. </p> <p>What's going on?</p> <p>My Javascript:</p> <pre><code> fileCount = 0; barWidth = 0; $(function() { var uploader = new plupload.Uploader({ runtimes : 'flash', browse_button : 'pickfiles', max_file_size : '10mb', url : 'js/upload/upload.php', resize : {width : 700, height : 700, quality : 90}, flash_swf_url : 'js/upload/plupload.flash.swf', filters : [ {title : "Image files", extensions : "jpg,gif,png"}, ] }); uploader.bind('Init', function(up, params) { }); uploader.bind('FilesAdded', function(up, files) { $.each(files, function(i, file) { fileCount ++ $('#uploadfiles').fadeIn(200); $('#filelist').append( '&lt;div id="' + file.id + '"&gt;' + file.name + ' (' + plupload.formatSize(file.size) + ') &lt;b&gt;&lt;/b&gt;' + '&lt;/div&gt;'); }); }); uploader.bind('FileUploaded', function(up, file) { console.log(file.name); $('#'+ file.id).fadeOut(200); }); uploader.bind('UploadProgress', function(up, file) { barWidth = barWidth+(file.percent/fileCount) $('#progressBar').animate({"width":barWidth+"%"},300); if (barWidth == 100 ) {$('#progressBox').delay(2000).fadeOut(200)}; }); $('#uploadfiles').click(function(e) { e.preventDefault(); $('#filelist').fadeIn(200, function() { $('#progressBox').fadeIn(200, function() { uploader.start(); }); }); }); uploader.init(); }); </code></pre> <p>My HTML (updated per comment below):</p> <pre><code>&lt;form method="post" action="js/upload/upload.php" enctype="multipart/form-data"&gt; &lt;div&gt; &lt;button id="pickfiles" href="#"&gt;Add...&lt;/button&gt; &lt;button id="uploadfiles" href="#"&gt;Upload&lt;/button&gt; &lt;br /&gt; &lt;div id="filelist"&gt;&lt;/div&gt; &lt;div id="progressBox"&gt;&lt;div id="progressBar"&gt;&lt;/div&gt;&lt;/div&gt; &lt;/div&gt; &lt;/form&gt; </code></pre> </div>

大学四年自学走来,这些私藏的实用工具/学习网站我贡献出来了

大学四年,看课本是不可能一直看课本的了,对于学习,特别是自学,善于搜索网上的一些资源来辅助,还是非常有必要的,下面我就把这几年私藏的各种资源,网站贡献出来给你们。主要有:电子书搜索、实用工具、在线视频学习网站、非视频学习网站、软件下载、面试/求职必备网站。 注意:文中提到的所有资源,文末我都给你整理好了,你们只管拿去,如果觉得不错,转发、分享就是最大的支持了。 一、电子书搜索 对于大部分程序员...

在中国程序员是青春饭吗?

今年,我也32了 ,为了不给大家误导,咨询了猎头、圈内好友,以及年过35岁的几位老程序员……舍了老脸去揭人家伤疤……希望能给大家以帮助,记得帮我点赞哦。 目录: 你以为的人生 一次又一次的伤害 猎头界的真相 如何应对互联网行业的「中年危机」 一、你以为的人生 刚入行时,拿着傲人的工资,想着好好干,以为我们的人生是这样的: 等真到了那一天,你会发现,你的人生很可能是这样的: ...

程序员请照顾好自己,周末病魔差点一套带走我。

程序员在一个周末的时间,得了重病,差点当场去世,还好及时挽救回来了。

ArrayList源码分析(入门篇)

ArrayList源码分析 前言: 写这篇博客的主要原因是,在我上一次参加千牵科技Java实习生面试时,有被面试官问到ArrayList为什么查找的速度较快,插入和删除的速度较慢?当时我回答得不好,很大的一部分原因是因为我没有阅读过ArrayList源码,虽然最后收到Offer了,但我拒绝了,打算寒假学得再深入些再广泛些,下学期开学后再去投递其他更好的公司。为了更加深入理解ArrayList,也为

我以为我学懂了数据结构,直到看了这个导图才发现,我错了

数据结构与算法思维导图

String s = new String(" a ") 到底产生几个对象?

老生常谈的一个梗,到2020了还在争论,你们一天天的,哎哎哎,我不是针对你一个,我是说在座的各位都是人才! 上图红色的这3个箭头,对于通过new产生一个字符串(”宜春”)时,会先去常量池中查找是否已经有了”宜春”对象,如果没有则在常量池中创建一个此字符串对象,然后堆中再创建一个常量池中此”宜春”对象的拷贝对象。 也就是说准确答案是产生了一个或两个对象,如果常量池中原来没有 ”宜春” ,就是两个。...

技术大佬:我去,你写的 switch 语句也太老土了吧

昨天早上通过远程的方式 review 了两名新来同事的代码,大部分代码都写得很漂亮,严谨的同时注释也很到位,这令我非常满意。但当我看到他们当中有一个人写的 switch 语句时,还是忍不住破口大骂:“我擦,小王,你丫写的 switch 语句也太老土了吧!” 来看看小王写的代码吧,看完不要骂我装逼啊。 private static String createPlayer(PlayerTypes p...

和黑客斗争的 6 天!

互联网公司工作,很难避免不和黑客们打交道,我呆过的两家互联网公司,几乎每月每天每分钟都有黑客在公司网站上扫描。有的是寻找 Sql 注入的缺口,有的是寻找线上服务器可能存在的漏洞,大部分都...

讲一个程序员如何副业月赚三万的真实故事

loonggg读完需要3分钟速读仅需 1 分钟大家好,我是你们的校长。我之前讲过,这年头,只要肯动脑,肯行动,程序员凭借自己的技术,赚钱的方式还是有很多种的。仅仅靠在公司出卖自己的劳动时...

上班一个月,后悔当初着急入职的选择了

最近有个老铁,告诉我说,上班一个月,后悔当初着急入职现在公司了。他之前在美图做手机研发,今年美图那边今年也有一波组织优化调整,他是其中一个,在协商离职后,当时捉急找工作上班,因为有房贷供着,不能没有收入来源。所以匆忙选了一家公司,实际上是一个大型外包公司,主要派遣给其他手机厂商做外包项目。**当时承诺待遇还不错,所以就立马入职去上班了。但是后面入职后,发现薪酬待遇这块并不是HR所说那样,那个HR自...

女程序员,为什么比男程序员少???

昨天看到一档综艺节目,讨论了两个话题:(1)中国学生的数学成绩,平均下来看,会比国外好?为什么?(2)男生的数学成绩,平均下来看,会比女生好?为什么?同时,我又联想到了一个技术圈经常讨...

副业收入是我做程序媛的3倍,工作外的B面人生是怎样的?

提到“程序员”,多数人脑海里首先想到的大约是:为人木讷、薪水超高、工作枯燥…… 然而,当离开工作岗位,撕去层层标签,脱下“程序员”这身外套,有的人生动又有趣,马上展现出了完全不同的A/B面人生! 不论是简单的爱好,还是正经的副业,他们都干得同样出色。偶尔,还能和程序员的特质结合,产生奇妙的“化学反应”。 @Charlotte:平日素颜示人,周末美妆博主 大家都以为程序媛也个个不修边幅,但我们也许...

MySQL数据库面试题(2020最新版)

文章目录数据库基础知识为什么要使用数据库什么是SQL?什么是MySQL?数据库三大范式是什么mysql有关权限的表都有哪几个MySQL的binlog有有几种录入格式?分别有什么区别?数据类型mysql有哪些数据类型引擎MySQL存储引擎MyISAM与InnoDB区别MyISAM索引与InnoDB索引的区别?InnoDB引擎的4大特性存储引擎选择索引什么是索引?索引有哪些优缺点?索引使用场景(重点)...

如果你是老板,你会不会踢了这样的员工?

有个好朋友ZS,是技术总监,昨天问我:“有一个老下属,跟了我很多年,做事勤勤恳恳,主动性也很好。但随着公司的发展,他的进步速度,跟不上团队的步伐了,有点...

我入职阿里后,才知道原来简历这么写

私下里,有不少读者问我:“二哥,如何才能写出一份专业的技术简历呢?我总感觉自己写的简历太烂了,所以投了无数份,都石沉大海了。”说实话,我自己好多年没有写过简历了,但我认识的一个同行,他在阿里,给我说了一些他当年写简历的方法论,我感觉太牛逼了,实在是忍不住,就分享了出来,希望能够帮助到你。 01、简历的本质 作为简历的撰写者,你必须要搞清楚一点,简历的本质是什么,它就是为了来销售你的价值主张的。往深...

玩转springboot启动banner定义所得

最近接手了一个springboot项目,不是不熟悉这个框架,启动时打印的信息吸引了我。 这不是我熟悉的常用springboot的打印信息啊,我打开自己的项目: 还真是的,不用默认的感觉也挺高大上的。一时兴起,就去研究了一下源代码,还正是有些收获,稍后我会总结一下。正常情况下做为一个老程序员,是不会对这种小儿科感兴趣的,不就是一个控制台打印嘛。哈哈! 于是出于最初的好奇,研究了项目的源代码。看到

带了6个月的徒弟当了面试官,而身为高级工程师的我天天修Bug......

即将毕业的应届毕业生一枚,现在只拿到了两家offer,但最近听到一些消息,其中一个offer,我这个组据说客户很少,很有可能整组被裁掉。 想问大家: 如果我刚入职这个组就被裁了怎么办呢? 大家都是什么时候知道自己要被裁了的? 面试软技能指导: BQ/Project/Resume 试听内容: 除了刷题,还有哪些技能是拿到offer不可或缺的要素 如何提升面试软实力:简历, 行为面试,沟通能...

离职半年了,老东家又发 offer,回不回?

有小伙伴问松哥这个问题,他在上海某公司,在离职了几个月后,前公司的领导联系到他,希望他能够返聘回去,他很纠结要不要回去? 俗话说好马不吃回头草,但是这个小伙伴既然感到纠结了,我觉得至少说明了两个问题:1.曾经的公司还不错;2.现在的日子也不是很如意。否则应该就不会纠结了。 老实说,松哥之前也有过类似的经历,今天就来和小伙伴们聊聊回头草到底吃不吃。 首先一个基本观点,就是离职了也没必要和老东家弄的苦...

男生更看重女生的身材脸蛋,还是思想?

往往,我们看不进去大段大段的逻辑。深刻的哲理,往往短而精悍,一阵见血。问:产品经理挺漂亮的,有点心动,但不知道合不合得来。男生更看重女生的身材脸蛋,还是...

为什么程序员做外包会被瞧不起?

二哥,有个事想询问下您的意见,您觉得应届生值得去外包吗?公司虽然挺大的,中xx,但待遇感觉挺低,马上要报到,挺纠结的。

当HR压你价,说你只值7K,你该怎么回答?

当HR压你价,说你只值7K时,你可以流畅地回答,记住,是流畅,不能犹豫。 礼貌地说:“7K是吗?了解了。嗯~其实我对贵司的面试官印象很好。只不过,现在我的手头上已经有一份11K的offer。来面试,主要也是自己对贵司挺有兴趣的,所以过来看看……”(未完) 这段话主要是陪HR互诈的同时,从公司兴趣,公司职员印象上,都给予对方正面的肯定,既能提升HR的好感度,又能让谈判气氛融洽,为后面的发挥留足空间。...

面试:第十六章:Java中级开发(16k)

HashMap底层实现原理,红黑树,B+树,B树的结构原理 Spring的AOP和IOC是什么?它们常见的使用场景有哪些?Spring事务,事务的属性,传播行为,数据库隔离级别 Spring和SpringMVC,MyBatis以及SpringBoot的注解分别有哪些?SpringMVC的工作原理,SpringBoot框架的优点,MyBatis框架的优点 SpringCould组件有哪些,他们...

面试阿里p7,被按在地上摩擦,鬼知道我经历了什么?

面试阿里p7被问到的问题(当时我只知道第一个):@Conditional是做什么的?@Conditional多个条件是什么逻辑关系?条件判断在什么时候执...

终于懂了TCP和UDP协议区别

终于懂了TCP和UDP协议区别

你打算用Java 8一辈子都不打算升级到Java 14,真香

我们程序员应该抱着尝鲜、猎奇的心态,否则就容易固步自封,技术停滞不前。

无代码时代来临,程序员如何保住饭碗?

编程语言层出不穷,从最初的机器语言到如今2500种以上的高级语言,程序员们大呼“学到头秃”。程序员一边面临编程语言不断推陈出新,一边面临由于许多代码已存在,程序员编写新应用程序时存在重复“搬砖”的现象。 无代码/低代码编程应运而生。无代码/低代码是一种创建应用的方法,它可以让开发者使用最少的编码知识来快速开发应用程序。开发者通过图形界面中,可视化建模来组装和配置应用程序。这样一来,开发者直...

面试了一个 31 岁程序员,让我有所触动,30岁以上的程序员该何去何从?

最近面试了一个31岁8年经验的程序猿,让我有点感慨,大龄程序猿该何去何从。

大三实习生,字节跳动面经分享,已拿Offer

说实话,自己的算法,我一个不会,太难了吧

程序员垃圾简历长什么样?

已经连续五年参加大厂校招、社招的技术面试工作,简历看的不下于万份 这篇文章会用实例告诉你,什么是差的程序员简历! 疫情快要结束了,各个公司也都开始春招了,作为即将红遍大江南北的新晋UP主,那当然要为小伙伴们做点事(手动狗头)。 就在公众号里公开征简历,义务帮大家看,并一一点评。《启舰:春招在即,义务帮大家看看简历吧》 一石激起千层浪,三天收到两百多封简历。 花光了两个星期的所有空闲时...

《经典算法案例》01-08:如何使用质数设计扫雷(Minesweeper)游戏

我们都玩过Windows操作系统中的经典游戏扫雷(Minesweeper),如果把质数当作一颗雷,那么,表格中红色的数字哪些是雷(质数)?您能找出多少个呢?文中用列表的方式罗列了10000以内的自然数、质数(素数),6的倍数等,方便大家观察质数的分布规律及特性,以便对算法求解有指导意义。另外,判断质数是初学算法,理解算法重要性的一个非常好的案例。

立即提问
相关内容推荐