javascript - 我希望我的 Canvas 对象出现在弹出窗口中

Question

我是JS编程的初学者。我有一个类 CanvasObjet ，它是功能性的(我在 HTML 上测试了它)，只是我希望当我们单击某些按钮时此 Canvas 出现在弹出窗口中。我尝试了 window.open () 但它不完全是我想要的，alert() 在 [HTMLCanvasElement] 中返回我的 Canvas

class Formulaire {
constructor() {
reserv.addEventListener("click", ()=>{
//the function i need for a popup of canvas here
localStorage.setItem("nom",nom.value);
localStorage.setItem("prenom",prenom.value);
this.tempsRestant();
temps.textContent = "Lorem Ipsum" + prenom.value + "Lorem Ipsum " + nom.value;
})

class CanvasObjet {
constructor() {
this.canvas = document.getElementById('canvas');
//Appelle l'interface CanvasRenderingContext2d
this.ctx = this.canvas.getContext('2d');
this.ctx.strokeStyle = '#000000';
this.ctx.lineWidth = 3;
this.draw = false;
this.mousePosition = {
    x: 0,
    y: 0
    };
this.lastPosition = this.mousePosition;
this.clearButton = document.getElementById("clear");
this.canvas.width = 300;
this.canvas.height = 300;
this.evenements();
};


<canvas id="canvas" width="300" height="300"></canvas>

Answer 1

Window.open 在新选项卡中打开某些内容。

如果你想要一个弹出窗口，你需要使用 css 来做到这一点。但我建议你为此使用 bootstrap，我一直使用它。

查看模态框(弹出窗口)的文档:https://getbootstrap.com/docs/4.3/components/modal/

我希望这有帮助。