Question

I made a list of fruits and vegetables that the user is supposed to drag&drop into two separate divs. Here's a relevant piece of the code (which is almost the copy of the code from this tutorial video: https://www.youtube.com/watch?v=-JFkAaLOou8中“name”属性的安全替代方法：

<script>
$(document).ready(function (){
    $("#source li").draggable({
    helper: 'clone',
    revert: 'invalid'
    });
    $("#fruits1").droppable({
        accept: 'li[data-value="fruit"]',
        drop: function (event, ui){
            $("#fruits2").append(ui.draggable);
        }
    });
    $("#vegetables1").droppable({
        accept: 'li[data-value="vegetable"]',
        drop: function (event, ui){
            $("#vegetables2").append(ui.draggable);
        }
    });
<script>

HTML：

<div>
   <ul id="source">
      <li data-value="fruit">Banana</li>
      <li data-value="fruit">Strawberry</li>
      <li data-value="fruit">Pear</li>
      <li data-value="vegetable">Lettuce</li>
      <li data-value="vegetable">Carrot</li>
      <li data-value="vegetable">Cauliflower</li>
   </ul>
</div>

<div id="fruits1">
   <ul id="fruits2">
   </ul>
</div>

<div id="vegetables1">
   <ul id="vegetables2">
   </ul>
</div>

我想添加一个“重置”按钮，在用户完成拖动之后将所有内容都带到原始位置。删除列表元素。我怎么做？我尝试过这样的事情：

$("#fruits2").remove();
$("#vegetables2").remove();

或：

$("#source li").css({"left":"","top":""});

但它似乎不起作用。

Answer 1

你可以通过以下方式实现这一目标：

mysqli_query($connection, "INSERT INTO tbl_used (message_ID,timeOfUse) VALUES($msgID, NOW())");

Answer 2

我已经看到很多人都面临这种问题，人们在猜测而不是帮助我们了解精确的解决方案。

在这里，我做了一 I/flutter (25205): E/flutter (25205): E/flutter (25205): #0 E/flutter (25205): E/flutter (25205): #1 E/flutter (25205): #2 E/flutter (25205): #3 E/flutter (25205): #4 E/flutter (25205): #5 E/flutter (25205): #6 E/flutter (25205): #7 E/flutter (25205): #8 E/flutter (25205): #9 E/flutter (25205): #10 E/flutter (25205): #11 E/flutter (25205): #12 E/flutter (25205): #13 E/flutter (25205): #14 E/flutter (25205): #15 E/flutter (25205): #16 E/flutter (25205): #17 E/flutter (25205): #18 E/flutter (25205): #19 E/flutter (25205): #20 E/flutter (25205): #21 E/flutter (25205): #22 E/flutter (25205): #23 E/flutter (25205): #24 E/flutter (25205): #25 E/flutter (25205): #26 E/flutter (25205): #27 E/flutter (25205): #28 E/flutter (25205): #29 E/flutter (25205): #30 E/flutter (25205): #31 E/flutter (25205): #32 E/flutter (25205): #33 E/flutter (25205): #34 E/flutter (25205): #35 E/flutter (25205): #36 E/flutter (25205): #37 E/flutter (25205): #38 E/flutter (25205): #39 E/flutter (25205): #40 E/flutter (25205): #41 E/flutter (25205): #42 E/flutter (25205): #43 E/flutter (25205): #44 E/flutter (25205): #45 https://jsfiddle.net/JunaidAli/wp1n796q/321/

How to reset the position of draggable list items in jQuery UI?

2 个答案: