如何使用jquery查找哪个元素是drop

时间:2014-12-17 10:01:09

标签: jquery html ajax

我希望两个元素在一个位置拖放,放置位置相同。我想识别哪个元素被丢弃usig jquery。需要拖动一个文本框和image.Text框id'draggable'.Image有id' draggable_img'。如何找到哪个元素被丢弃?有人帮我吗?

代码

 <span id="draggable" >
<input name="" type="text" >
</span><br/>
<span id="draggable_img"  style="padding-left:10px;">
<img  src="../fancy/demo/1_b.jpg" height="50" width="50">
</span>

//drop
  <div  id="preview"
     <div id="drop">
     </div>
  </div>
 //drop


 javascript

   $(function() {
   $("#draggable").draggable(); 
   });
   $(function() {
   $("#draggable_img").draggable();
   });


    $.ajax({
    type: "GET",
    url: 'data.php',
    data:'page='+page + '&width=' + width + '&height=' + height + '&rows=' + rows,
    success: function(msg)
     { 
      $("#preview").html(msg);
      $("#preview").droppable({
                drop: function (event, ui) {
                    $(".droppable2").append("<span id='draggable'>
          <img  src='../fancy/demo/1_b.jpg' height='50' width='50'></span>")
                }
            });
        $("#drop").droppable({
                drop: function (event, ui) {
                    $(".droppable2").append("<span id='draggable'>
          <input type='text' name=''></span>")
                }
            }); 
     }
      });

1 个答案:

答案 0 :(得分:0)

the docsui参数有一个draggable属性,表示被拖动的元素:

$("#drop").droppable({
    drop: function (event, ui) {
        // id of the dropped element
        var draggedId = ui.draggable.prop("id");
        $(".droppable2").append("<span id='draggable'><input type='text' name=''></span>");
    }
});