如何获得不同图像jquery的特定src ?

I am developing the drag and drop web application. My problem is I can get the src of the first dragged element. But when I drag the second element, it will get the same src of the first element. I use $(this).find(".drag").attr("src") to get the src of image.

我正在开发拖放web应用程序。我的问题是我可以得到第一个拖拽元素的src。但是当我拖拽第二个元素时，它会得到第一个元素相同的src。我使用$(这个).find(“.drag”).attr(“src”)来获取图像的src。

For example,

例如,

drag the fist element src -> item_head/head45.png

拖动第一个元素src -> item_head/head45.png

drag the second element src -> item_head/head45.png (but second element src->item_head/head46.png )

拖动第二个元素src -> item_head/head45。但是第二个元素src->item_head/head46。png)

<div class="wrapper">
 <div id="options">
    <?php 
        $strSQL = "SELECT * FROM item_head ORDER BY ihead_id DESC";
       $objQuery = mysqli_query($con,$strSQL);
       while($row = mysqli_fetch_array($objQuery)){
   ?>               
    <img width="150" height="120" src="item_head/<?php echo $row['filesName'];?>" id="drag1" class="drag"></img>
   <?php}?>
</div>

Script:

脚本:

$("#frame").droppable({
        drop: function(ev, ui) {
            if (ui.helper.attr('id').search(/drag[0-9]/) != -1){
                counter++;
                var element = $(ui.draggable).clone();
                element.addClass("tempclass");
                $(this).append(element);
                $(".tempclass").attr("id","clonediv"+counter);
                $("#clonediv"+counter).removeClass("tempclass");
                //Get the dynamically item id
                draggedNumber = ui.helper.attr('id').search(/drag([0-9])/)
                itemDragged = "dragged" + RegExp.$1;
                var objsrc = $(this).find(".drag").attr("src");
                alert(objsrc);
                console.log(itemDragged)
                $("#clonediv"+counter).addClass(itemDragged);
                var objtop  = ui.offset.top - $(this).offset().top;

            }
        }
});

1 个解决方案

#1

$(this).find(".drag") will not return a single element. Use .last()

$(this).find(“.drag”)不会返回单个元素。使用.last()

$("#frame").droppable({
        drop: function(ev, ui) {
            if (ui.helper.attr('id').search(/drag[0-9]/) != -1){
                counter++;
                var element = $(ui.draggable).clone();
                element.addClass("tempclass");
                $(this).append(element);
                $(".tempclass").attr("id","clonediv"+counter);
                $("#clonediv"+counter).removeClass("tempclass");
                //Get the dynamically item id
                draggedNumber = ui.helper.attr('id').search(/drag([0-9])/)
                itemDragged = "dragged" + RegExp.$1;
                var objsrc = $(this).find(".drag").last().attr("src");
                alert(objsrc);
                console.log(itemDragged)
                $("#clonediv"+counter).addClass(itemDragged);
                var objtop  = ui.offset.top - $(this).offset().top;

            }
        }
});