1

メインのdivがあり、クリックしたときにキャプチャされる座標にさらにいくつかのdivを配置したいと思います。正常に動作し、divの上下の位置が変更されますが、メインのdivをもう一度クリックすると、最初のクリックですでに表示されているdivがドラッグされるという問題があります。最初のクリックで表示されるdivを、メインのdivをもう一度クリックしたときに移動を停止したい。本当に感謝しています。

コード:

    $(document).ready(function(){
    $("#main_div").click(function(event, ui){

    var x = event.pageX-document.getElementById("main_div").offsetLeft;
    var y = event.pageY-document.getElementById("main_div").offsetTop;

    document.pointform.form_x.value = x;
    document.pointform.form_y.value = y;


    $("#container-5").css({"top":y,"left":x});
    $("#EDate").css({"top":y,"left":x});

 });
 });
4

1 に答える 1

3

イベント ハンドラーを削除するだけの場合は、次のunbind()メソッドを使用できます。

$(document).ready(function(){
    $("#main_div").click(function(event, ui){

    var x = event.pageX-document.getElementById("main_div").offsetLeft;
    var y = event.pageY-document.getElementById("main_div").offsetTop;

    document.pointform.form_x.value = x;
    document.pointform.form_y.value = y;


    $("#container-5").css({"top":y,"left":x});
    $("#EDate").css({"top":y,"left":x});

    // and here we unbind it
    $(this).unbind('click');

   });
});

あなたのコメントごと:

$(document).ready(function(){
    $("body").click(function(event, ui){
    var i = 0;
    if($(this).data("index"))
      i = $(this).data("index");
    else
      $(this).data("index", i = 0);

    var x = event.clientX;
    var y = event.clientY;


    if($("#container-" + i)[0])
        $("#container-" + i).css({"top":y,"left":x});
    else
        $(this).unbind("click");


    $(this).data("index",i+1);


   });
});​

デモ: http://jsfiddle.net/Sn9Xx/show
ソース: http://jsfiddle.net/Sn9Xx/

于 2012-10-08T07:50:14.677 に答える