欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

javascript實(shí)現(xiàn)粘貼qq截圖功能（clipboardData）

 更新時(shí)間：2016年05月29日 11:43:00   作者：silenceboy  
這篇文章主要介紹了javascript實(shí)現(xiàn)粘貼qq截圖功能，利用clipboardData在網(wǎng)頁中實(shí)現(xiàn)截屏粘貼的功能，感興趣的小伙伴們可以參考一下

這篇文章主要介紹了在網(wǎng)頁中實(shí)現(xiàn)讀取剪貼板粘貼截圖功能,即可以把剪貼板的截圖Ctrl+V粘貼到網(wǎng)頁的一個(gè)輸入框中,例如QQ截圖、旺旺截圖或者其它截圖軟件。具體代碼如下。

<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>利用 clipboardData 在網(wǎng)頁中實(shí)現(xiàn)截屏粘貼的功能</title>
<style type="text/css">
#box{ width:200px; height:200px; border:1px solid #ddd; }
</style>
</head>
<body>

<h1>利用 clipboardData 在網(wǎng)頁中實(shí)現(xiàn)截屏粘貼的功能</h1>  
<hr />
<div><input type="text" id="testInput" placeholder="截屏后粘貼到輸入框中" size="30" /></div>
<script type="text/javascript">
(function(){
  var imgReader = function( item ){
    var blob = item.getAsFile(),
      reader = new FileReader();
    // 讀取文件后將其顯示在網(wǎng)頁中
    reader.onload = function( e ){
      var img = new Image();

      img.src = e.target.result;
      document.body.appendChild( img );
    };
    // 讀取文件
    reader.readAsDataURL( blob );
  };
  document.getElementById( 'testInput' ).addEventListener( 'paste', function( e ){
     // 添加到事件對(duì)象中的訪問系統(tǒng)剪貼板的接口
    var clipboardData = e.clipboardData,
      i = 0,
      items, item, types;

    if( clipboardData ){
      items = clipboardData.items;
      if( !items ){
        return;
      }
      item = items[0];
      // 保存在剪貼板中的數(shù)據(jù)類型
      types = clipboardData.types || [];
      for( ; i < types.length; i++ ){
        if( types[i] === 'Files' ){
          item = items[i];
          break;
        }
      }
      // 判斷是否為圖片數(shù)據(jù)
      if( item && item.kind === 'file' && item.type.match(/^image\//i) ){
        imgReader( item );
      }
    }
  });
})(); 
</script>
</body>
</html>

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家學(xué)習(xí)JavaScript程序設(shè)計(jì)有所幫助。

相關(guān)文章

最新評(píng)論