如何检测当前选择的可调整大小的&可拖动的div以及它的坐标

时间:2017-10-07 19:36:44

标签: jquery html

在我的一个网页中,我有一个大容器div。我还有一个按钮,当时 点击,生成一个新的可调整大小的& draggable div并附加到容器div。

所以,一次,容器div可能包含多个可调整大小的&可拖动的div。

<div id="container">

</div>

我的代码用于生成和附加可调整大小的&amp;可拖动的div是:

$(document).ready(function() {
    $.fn.genUID = function(){ 
        var x = Math.floor((Math.random() * 1000) + 1);
        var y = Math.floor((Math.random() * 2000) + 1000);
        var z = Date.now();
        return "uid-" + (x * y * z).toString();        
    }
    $('#btnCreateSelector').click(function() {
        var guid = $.fn.genUID();

        var string = '<div id="' + guid + '" class="sel_area" style="box-sizing: content-box;top: 0; left: 0; width: 140px; height: 140px;">';
        string += "</div>";
        $("#container").append(string);   
        $(".sel_area").resizable({
            handles: "n, e, s, w, nw, ne, sw, se",
        }).draggable();
    });

});

现在我想保存任何可调整大小的宽度,高度和坐标。数据库中的可拖动div,这就是问题所在。 我无法弄清楚如何检测当前选择的div以及如何确定其当前坐标。

希望您能理解我的问题。我们非常感谢您对代码段的任何帮助。谢谢。

1 个答案:

答案 0 :(得分:0)

首先你必须使用;

    $(document).click(function(e){
      var x = $(e.target).attr('id');
});

获取点击的元素和

 function handleDragStop( event, ui ) {
  var offsetXPos = parseInt( ui.position.left );
  var offsetYPos = parseInt( ui.position.top );
}

获得职位。