Javascript 如何使用Jquery创建在多个div上重叠的onclick div

我是根据图1创建日历的，所以我的问题是我想创建一个与div重叠的onclick div，即如果单击00:00列，而不是创建div start 00:00到07:00，持续8小时

图像1

所以请给我一些指导。什么是更好的解决方案

已在使用拖放将事件分配给员工。 我想创建重叠Div，如下图2所示 这是创建的onclick div

  $("body").on("mousedown", ".Dropabletd", function () {
        Myleft = $(this).position().left;
        Mytop = $(this).position().top;
        $(this).append("<div class='dynatext label' id='divId'>J'e Divs Created</div>");
        $("#divId").css({zIndex: 999,position: "absolute", top: Mytop, left: Myleft, width: '100%', display: "block"});
    });

---

没有朋友回答我谢谢，因为我发现这是我自己，并学会了。 如有任何更改，建议，欢迎尊敬的先生/女士

$("body").on("dblclick", ".Dropablesub_td", function () {
            var hidid = $(this).attr("id");
            var Myleft = $(this).position().left;
            var Mytop = $(this).position().top;
            var id = $(this).parent().nextAll().eq($(this).parent().index() + 8).attr("id");
            if ($(this).parent().index() > 16) {
                var widths = "100%";
            } else {
                var widths = $(this).parent().width() * 8;
            }
            var heights = $(this).height();
            $(this).html("<span id='" + hidid.replace(":", "_") + "'  class='divId label label-success unselectable' >ABCDEFGHIJKLMNOPQRSTUVWXYZ<span>");
            $(this).children().css({zIndex: 999, position: "absolute", top: Mytop, left: Myleft, width: widths, height: heights, display: "block", border: "#808080 solid 2px", color: "black", background: "#00CEB4"});
            $(".divId").resizable({
                handles: 'w'
            });
            Dragging2();
        });

$（“body”）.on（“dblclick”，“.Dropablesub_td”，函数（）{
var hidid=$（this.attr（“id”）；
var Myleft=$（this）.position（）.left；
var Mytop=$（this）.position（）.top；
var id=$（this.parent（）.nextAll（）.eq（$（this.parent（）.index（）+8.attr（“id”）；
如果（$（this.parent（）.index（）>16）{
风险值宽度=“100%”；
}否则{
变量宽度=$（this）.parent（）.width（）*8；
}
var heights=$（this.heights（）；
$（this.html（“ABCDEFGHIJKLMNOPQRSTUVWXYZ”）；
$（this）.children（）.css（{zIndex:999，位置：“绝对”，顶部：Mytop，左侧：Myleft，宽度：宽度，高度：高度，显示：“块”，边框：“808080实心2px”，颜色：“黑色”，背景：“00CEB4”）；
$（“.divId”）。可调整大小({
手柄：“w”
});
拖动2（）；
});

$("body").on("dblclick", ".Dropablesub_td", function () {
            var hidid = $(this).attr("id");
            var Myleft = $(this).position().left;
            var Mytop = $(this).position().top;
            var id = $(this).parent().nextAll().eq($(this).parent().index() + 8).attr("id");
            if ($(this).parent().index() > 16) {
                var widths = "100%";
            } else {
                var widths = $(this).parent().width() * 8;
            }
            var heights = $(this).height();
            $(this).html("<span id='" + hidid.replace(":", "_") + "'  class='divId label label-success unselectable' >ABCDEFGHIJKLMNOPQRSTUVWXYZ<span>");
            $(this).children().css({zIndex: 999, position: "absolute", top: Mytop, left: Myleft, width: widths, height: heights, display: "block", border: "#808080 solid 2px", color: "black", background: "#00CEB4"});
            $(".divId").resizable({
                handles: 'w'
            });
            Dragging2();
        });