当前位置：网站首页>JS to paste pictures into web pages

JS to paste pictures into web pages

2022-06-23 01:30:00 【hhzzcc_】

Achieved by pressing ctrl + v Paste the picture on the pasteboard into the web page , Go straight to the code without saying anything

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title> Picture paste </title>
    <style> #img{ width: 500px; } </style>
    <img id="img" src="" alt="">
     adopt Ctrl + v Paste the picture 
</head>
<body>
    <script> setPasteImg(); // Get the picture on the pasteboard  function setPasteImg(){ // Paste the event  document.addEventListener('paste', function(event){ if (event.clipboardData || event.originalEvent) { var clipboardData = (event.clipboardData || event.originalEvent.clipboardData); if(clipboardData.items){ var blob; for (var i = 0; i < clipboardData.items.length; i++) { if (clipboardData.items[i].type.indexOf("image") !== -1) { blob = clipboardData.items[i].getAsFile(); } } var render = new FileReader(); render.onload = function (evt) { // Output base64 code  var base64 = evt.target.result; document.getElementById('img').setAttribute('src',base64); } render.readAsDataURL(blob); } } }) } </script>
</body>
</html>