鍍金池/ 問答/HTML5  HTML/ 實現js獲取圖片1像素顏色來填充父級div背景

實現js獲取圖片1像素顏色來填充父級div背景

想實現js獲取圖片1像素顏色來填充父級div背景。但function功能不會寫，高手賜教

<head>
<style>
.wrap{
  width:100%;
}
.aaa{
  margin:0 auto;
  display:block;
  width:300px;
  height:200px;
  background-image:url(http://img.netbian.com/file/2018/0118/8d69998fb492dbf4cbddcbb531286a3b.jpg);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100%;
}
</style>
</head>
<body>
  <div class="wrap">
  <a class="aaa" id="bgcolor"></a>
  </div>
  
<script src="http://www.jq22.com/jquery/jquery-1.10.2.js" type="text/javascript"></script>
<script src="http://www.jq22.com/demo/getcanvaspixelcolor20151227/getcanvaspixelcolor.js" type="text/javascript"></script>

<script type="text/javascript">
  var draw = function(img) {
  var canvas = document.getElementById("bgcolor");
  var context = canvas.getContext("2d");
  context.drawImage(img, 0, 0);

  var colorData = canvas.getPixelColor(1, 1); // 獲取x=1,y=1像素處的顏色
  var color = colorData.rgba;
  $("wrap").css("backgroundColor", color);
}
$(document).ready(function () {
  //var img = new Image();
  //img.src = document.getElementById('bgcolor').style.backgroundImage; 
  //$(img).load(function () {
  //draw(img);
  //});
});
</script>
</body>
回答
編輯回答
懷中人

$("wrap").css("backgroundColor", color);改成
$(".wrap").css("background-color", color);

2018年2月27日 06:38