Question

我有2个jQuery函数，一个允许排序，另一个允许从列表中删除div。一切正常，直到我删除其中一个列表项。然后拖动停止工作，直到我刷新页面。

我也遇到了删除功能没有立即删除被点击删除的div的问题，如果单击了多个，则只会删除最新的。这就是为什么在下面的删除功能中刷新div。

非常感谢任何帮助！

JQuery Sortable

    $(document).ready(function(){   
          function slideout(){
      setTimeout(function(){
      $("#response").slideUp("slow", function () {
          });

    }, 2000);}

        $("#response").hide();
        $(function() {
        $("#list ul").sortable({ opacity: 0.8, cursor: 'move', update: function() {

                var order = $(this).sortable("serialize") + '&update=update'; 
                $.post("updateReadingList.php", order, function(theResponse){
                    $("#response").html(theResponse);
                    $("#response").slideDown('slow');
                    slideout();
                });                                                              
            }                                 
            });
        });

    });

JQuery删除功能

    $(document).ready(function(){ $(function() {
        $( '#reading' ).on( 'click', 'a.deletefromrl', function(){
            $(this).closest('li').fadeOut('slow');
            var order = $('#list ul').sortable("serialize") + '&update=update' + '&id=' + $(this).attr('data-storyid'); 
            $.post("deletefromReadingList.php", order, function(theResponse){
                    $("#response").html(theResponse);
                }); 
                var auto_refresh = setInterval(
                    function()
                    {
                        $('ul').load('reloadReadingList.php');
                    }, 0);  
        })
    })
    })

Answer 1

一种解决方案是将绑定操作放在它自己的函数中并在页面加载时调用它，然后每次重新加载列表时都这样：

<强>编辑：我不确定最后一个出了什么问题，但这似乎对我有用：

$(document).ready(function(){   
  function slideout(){
      setTimeout(function(){
      $("#response").slideUp("slow", function () {
          });

    }, 2000);}

    function bindSortable()
    {
        $("#list ul").sortable(
        { 
            opacity: 0.8, 
            cursor: 'move', 
            update: function() {

                var order = $(this).sortable("serialize") + '&update=update'; 
                $.post("updateReadingList.php", order, function(theResponse){
                    $("#response").html(theResponse);
                    $("#response").slideDown('slow');
                    slideout();
                });                                                              
            }                                 
        });
    }

    bindSortable();

    $( '#reading' ).on( 'click', 'a.deletefromrl', function(){
        $(this).closest('li').fadeOut('slow');
        var order = $('#list ul').sortable("serialize") + '&update=update' + '&id=' + $(this).attr('data-storyid'); 
        $.post("deletefromReadingList.php", order, function(theResponse){
                $("#response").html(theResponse);
            }); 
            var auto_refresh = setInterval(
                function()
                {
                    $('ul').load('reloadReadingList.php', function()
                    {
                        bindSortable();
                    });
                }, 0);  
    })
});

刷新可排序Div后可排序不工作

1 个答案: