Question

我有一个表，其中有一个带有类拖动的div，这个元素可以拖放类，这个元素将接收一个拖动元素，我的问题是我想通过元素删除来更改拖动元素的原始位置。以下是我的代码：

<html>
<head>
<style>
.drag{
    height: 30px;
    width: 30px;
    background-color: red;
    margin: auto;
}
.drop{
    height: 35px;
    width: 35px;
    background-color: green;
}
</style>

<link rel="stylesheet" href="css/smoothness/jquery-ui-1.10.4.custom.css">

</head>
<body>
    <table>
        <tr>
            <td><div class="drop"></div></td>
            <td><div class="drop"></div></td>
            <td><div class="drop"></div></td>
            <td><div class="drop"></div></td>
        </tr>
        <tr>
            <td><div class="drop"></div></td>
            <td><div class="drop"></div></td>
            <td><div class="drop"></div></td>
            <td><div class="drag"></div></td>
        </tr>
        <tr>
            <td><div class="drop"></div></td>
            <td><div class="drag"></div></td>
            <td><div class="drop"></div></td>
            <td><div class="drag"></div></td>
        </tr>
    </table>

</body>
<script src="js/jquery-1.10.2.js"></script>
<script src="js/jquery-ui-1.10.4.custom.js"></script>
<script>
$(document).ready(function(){
    $('.drag').draggable({ 
        contaiment:'document',
        axis: 'y'
    });

    $('.drop').droppable({
        accept: '.drag',
        drop:function(event, ui){
            //alert(ui.draggable.attr('class'));
            $(this).remove();
        }
    });
});
</script>
</html>

Answer 1

As I understand, you should try this by removing the line **axis:'y'**.




 $(document).ready(function () {
    $('.drag').draggable({
        contaiment: 'document'
        //,axis: 'y'// comment this line
    });

    $('.drop').droppable({
        accept: '.drag',
        drop: function (event, ui) {

            $(this).remove();
        }
    });
});

Let me know if you need any other help.

如何使用droppable div删除可拖动的div

1 个答案: