无法在多画布应用程序中执行选择

Question

我正在使用Jquery的Fabric.js和HTML5（Canvas）开发一个应用程序，并且有2个画布。使用“显示”属性（CSS）我一次只显示一个画布。 第一个画布工作正常。但是当我显示第二个画布时，选择（在画布上拖动鼠标）被禁用。我无法在画布上选择任何对象，并且选择区域（通过拖动鼠标来实现）也不是绘图。

以下是我的代码段：

HTML：  <div id="divCanvas" style="overflow:scroll;width:665px; height:570px"> <canvas id="FrontCanvas"></canvas> <canvas id="BackCanvas"></canvas> </div>

使用Javascript： $("#btnRotate").click(function () { if ($("#c").parent().hasClass("visible")) { $("#c").parent().addClass("invisible").removeClass("visible"); $("#cb").parent().addClass("visible").removeClass("invisible"); } else { $("#c").parent().addClass("visible").removeClass("invisible"); $("#cb").parent().addClass("invisible").removeClass("visible"); } });

由于

Answer 1

得到答案........使用了calcOffset（）

$("#btnRotate").click(function () { if ($("#c").parent().hasClass("visible")) { $("#c").parent().addClass("invisible").removeClass("visible"); $("#cb").parent().addClass("visible").removeClass("invisible"); } else { $("#c").parent().addClass("visible").removeClass("invisible"); $("#cb").parent().addClass("invisible").removeClass("visible"); } canvas.calcOffset(); canvasBack.calcOffset(); });