使用jQuery顯示特定div中的QR碼圖像

Question

我成功地將我的QR碼轉換爲圖像，但它顯示在空白頁面中。我想要在div中顯示。 這裏是我的代碼：

$('#qrBloc').qrcode({width: 200,height: 200, text:"something"}); 
 
var canvas = document.querySelector("#qrBloc canvas"); 
 
var img = canvas.toDataURL("image/png"); 
 
document.write('<img id ="qrimg" src="'+img+'"/>');

<div id="qrBloc"> 
 
</div>

Answer 1

問題是document.write。

替換該行以

$('#qrBloc').append('<img id ="qrimg" src="'+img+'"/>'); 

還去除canvas元素，你可以做以下任一：

$('#qrBloc').empty().append('<img id ="qrimg" src="'+img+'"/>'); 

$('#qrBloc').html('<img id ="qrimg" src="'+img+'"/>'); 

文件https://api.jquery.com/category/manipulation/dom-insertion-inside/