Today, I found that segmentfault's comment can be pasted and uploaded, So I studied how to implement it! The principle is very simple. In fact, it is to monitor and paste events, and then check whether there are images in the pasted items. If so, ajax is directly triggered to upload more technical articles. Please visit: www.dahuzhi.com code can be directly run, if you are interested, try it.
Today, I found that segmentfault's comment can be pasted and uploaded, So I studied how to implement it! The principle is very simple in fact is to monitor the paste event, and then check whether there is a picture in the paste, if there is a direct trigger ajax upload more technical articles please visit: http://www.dahuzhi.com code can be directly run, if you are interested, try it.
Today, I found that segmentfault's comment can be pasted and uploaded, So I studied how to implement it!
The principle is very simple. In fact, it is to monitor and paste events, and then check whether there are images in the pasted items. If so, ajax upload is directly triggered.
For more technical articles visit: http://www.dahuzhi.com
Code can be run directly. If you are interested, try PHP JavaScript Localisation.
Script // search for the box element to check the document. querySelector ('# box '). addEventListener ('paste ', function (e) {// determine whether the image is pasted if (e. clipboardData & e. clipboardData. items [0]. type. indexOf ('image')>-1) {var that = this, reader = new FileReader (); file = e. clipboardData. items [0]. getAsFile (); // ajax uploads an image reader. onload = function (e) {var xhr = new XMLHttpRequest (), fd = new FormData (); xhr. open ('post', '', true); xhr. onload = function () {var img = new Image (); img. src = xhr. responseText; // that. innerHTML = ''; document. getElementById ("img_puth "). value = img. src;} // this. result to get the base64 (which can be used for instant display) fd of the image. append ('file', this. result); that. innerHTML = ''; xhr. send (fd);} reader. readAsDataURL (file) ;}}, false); script