从当前可拖动的<li> </li>获取ID

时间:2010-07-30 14:24:17

标签: jquery draggable

如何从当前的可拖动项中获取ID?

<style type="text/css">
    .red{ color: #ff0000; }    
</style>

<script type="text/javascript">
    $(function() {

    $(".dragg li").draggable();


    $("#droppable").droppable({

    hoverClass: 'red',
    over: function(event, ui)
    {
        //  $( --- ID FROM THE CURRENT DRAGABLE LI --- ).css('color','#ff0000');
    },
    out: function(event, ui)
    {
        // $( --- ID FROM THE CURRENT DRAGABLE LI --- ).css('color','#000000');
    }

    });


    });
</script>


    <div class="dragg">
        <li id="b1">Drag me to my target</li>
        <li id="b2">Drag me to my target</li>
        <li id="b3">Drag me to my target</li>        
    </div>

   <div id="droppable"  style="border: 1px solid #000000;">
       <br /><br />Drop here<br /><br />
   </div>

http://jsfiddle.net/FrbW8/13/

亲切的问候 彼得

2 个答案:

答案 0 :(得分:5)

您可以通过draggable参数的ui属性检索当前可拖动项目。

完成你的例子:

over: function(event, ui) {
    ui.draggable.addClass('red');
},
out: function(event, ui) {
    ui.draggable.removeClass('red');
}

或者,如果你想要ID:

ui.draggable.attr("id");

答案 1 :(得分:0)

$('.dragg li').mouseup(function(){
    var draggedID = $(this).attr("id");
});

应该返回你的身份。