在引导模态内的元素上使用offset会返回零

即时通讯使用HTML画布制作应用程序。我尝试使用jquery的.offset（）方法获取画布的偏移量，而且还可以。我的问题是当我尝试将画布放在模式上时，offset（）返回0 ...我如何在boostrap模式内获取画布的正确偏移量？

canvas = document.getElementById('canvas');
context = canvas.getContext('2d');
canvasOffset=$("#canvas").offset();
offsetX=canvasOffset.left;
offsetY=canvasOffset.top;

canvasOffset返回顶部和左侧为零...

您必须等待使用该shown.bs.modal事件的引导程序定位模态。模态之前未定位，因此画布的位置为0。

检查此样本：

// As soon as the modal is shown
$('#myModal').on('shown.bs.modal', function() {
  // Get the right offset
  var offset = $("#canvas").offset();
  $('body').append("
offset:" + offset.top + ", " + offset.left);
});

// On page load offset is 0, 0
var offset = $("#canvas").offset();
$('body').append("
offset:" + offset.top + ", " + offset.left);

  Launch demo modal




  

    

      

        ×
        
        
Modal title
      
      

        
      
      

        Close