jquery 错误排序序列化

发布于 2024-08-21 05:30:13 字数 2366 浏览 6 评论 0原文

我发现 jquery 的一个很奇怪的行为。我这里有两个列表,我将 li 元素从一个列表拖放到另一个列表,当前的排序由 ajax-mysql 保存。现在今天下午我注意到有时,只是有时最后放置的项目的位置没有正确保存,它被保存为“0”,而它应该是例如4或5。我花了几个小时才发现这种行为是在与警报直接相关,该警报在掉落项目后触发:

alert(data);       <---- data is the current sorting of the ids

如果我删除此行,则会出现上述脚本的奇怪行为。也许有人以前经历过类似的事情并可以分享一些建议?

问候,Maschek

编辑:这是包含警报的函数:

            $(function() {

             $("#sortable2").sortable({

                  items: \'li:not(.col_header)\',
            connectWith: \'#sortable2, #sortable1, #sortable1b, #sortable1c\',   
            helper: \'clone\',
            placeholder: \'empfaenger-highlight\',
         revert: \'invalid\',
         update: function() {

              var data = $(this).sortable("serialize") + \'&user='.$user.'\';

              alert(data);
              var order = $(this).sortable("serialize") + 
              \'&action=updateList&user='.$user.'\'; 
             $.post("index.php?eID=moveitems", order, 
             function(theResponse){

                   $("#response").html(theResponse);
                   $("#response").slideDown(\'slow\');
                   slideout(); 

                 }); 

               } 

          }).disableSelection();

我尝试使用回调,以确保变量完全加载:

                    $(function() {

                     $("#sortable2").sortable({

                          items: \'li:not(.col_header)\',
                          connectWith: \'#sortable2, #sortable1, #sortable1b, #sortable1c\',            
                          helper: \'clone\',
                          placeholder: \'empfaenger-highlight\',
                          revert: \'invalid\',
                          update: function() {



                          var data = $(this).sortable("serialize");

                               function doSomething(data) {

                          };

                               //alert(data);
                               var order = data + \'&action=updateList&feuser='.$user.'\'; 

                               $.post("index.php?eID=moveitems", order,  function(theResponse){

                          }); 

                     }  

                }).disableSelection();

但所描述的错误行为仍然发生。有人可以告诉我,使用这个附加回调函数是否是正确的方法?或者我还必须如何处理这个问题,以确保正确的变量?谢谢你的建议...

i have discovered quite an odd behaviour of jquery. I have two lists here, where i drag and drop li-elements from one to another, the current sortings is being saved by ajax-mysql. Now this afternoon i noticed that sometimes, just sometimes the position of the last dropped item wasnt saved properly, it was saved as "0" when it should be for example 4 or 5. Took me some hours to find out that this behaviour is in direct relation to the alert, that is triggered after a drop of an item:

alert(data);       <---- data is the current sorting of the ids

If i remove this line, then the above described odd behaviour of the script appears. Maybe someone has experienced something like this before and can share some advise?

greets, Maschek

edit: This is the function, that contains the alert:

            $(function() {

             $("#sortable2").sortable({

                  items: \'li:not(.col_header)\',
            connectWith: \'#sortable2, #sortable1, #sortable1b, #sortable1c\',   
            helper: \'clone\',
            placeholder: \'empfaenger-highlight\',
         revert: \'invalid\',
         update: function() {

              var data = $(this).sortable("serialize") + \'&user='.$user.'\';

              alert(data);
              var order = $(this).sortable("serialize") + 
              \'&action=updateList&user='.$user.'\'; 
             $.post("index.php?eID=moveitems", order, 
             function(theResponse){

                   $("#response").html(theResponse);
                   $("#response").slideDown(\'slow\');
                   slideout(); 

                 }); 

               } 

          }).disableSelection();

I tried to use a callback, to ensure the variable being loaded completely:

                    $(function() {

                     $("#sortable2").sortable({

                          items: \'li:not(.col_header)\',
                          connectWith: \'#sortable2, #sortable1, #sortable1b, #sortable1c\',            
                          helper: \'clone\',
                          placeholder: \'empfaenger-highlight\',
                          revert: \'invalid\',
                          update: function() {



                          var data = $(this).sortable("serialize");

                               function doSomething(data) {

                          };

                               //alert(data);
                               var order = data + \'&action=updateList&feuser='.$user.'\'; 

                               $.post("index.php?eID=moveitems", order,  function(theResponse){

                          }); 

                     }  

                }).disableSelection();

But the descriped miss-behaviour still occurs. Can someone tell me, if the use of this additional callback-function is the right approach? Or how else would i have to handle this, to ensure properly variable? thanks for your advises...

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

狼亦尘 2024-08-28 05:30:13

你是对的,从输出代码中可能更容易阅读。脚本:

 <script type="text/javascript">
           $(document).ready(
           function () {
                function slideout(){

                setTimeout(function(){

                     $("#sortable3 .provider, #sortable3 .empfaenger, #response").fadeOut("slow", function () {

               });

           }, 2000);}


           $(function() {

                $("#sortable2").sortable({

                     items: 'li:not(.col_header)',
                    connectWith: '#sortable2, #sortable1, #sortable1b, #sortable1c',            
                    helper: 'clone',
                    placeholder: 'empfaenger-highlight',
                    revert: 'invalid',
                    update: function() {

      var data = $(this).sortable("serialize") + '&feuser=14';

      alert(data);
      var order = $(this).sortable("serialize") + 
      '&action=updateList&feuser=14'; 
      $.post("index.php?eID=moveitems", order, 
      function(theResponse){

                               $("#response").html(theResponse);
                               $("#response").slideDown('slow');
                               slideout();  

                          }); 

                     }  

                }).disableSelection();

You are right, probably more easy to read from the output-code. The script:

 <script type="text/javascript">
           $(document).ready(
           function () {
                function slideout(){

                setTimeout(function(){

                     $("#sortable3 .provider, #sortable3 .empfaenger, #response").fadeOut("slow", function () {

               });

           }, 2000);}


           $(function() {

                $("#sortable2").sortable({

                     items: 'li:not(.col_header)',
                    connectWith: '#sortable2, #sortable1, #sortable1b, #sortable1c',            
                    helper: 'clone',
                    placeholder: 'empfaenger-highlight',
                    revert: 'invalid',
                    update: function() {

      var data = $(this).sortable("serialize") + '&feuser=14';

      alert(data);
      var order = $(this).sortable("serialize") + 
      '&action=updateList&feuser=14'; 
      $.post("index.php?eID=moveitems", order, 
      function(theResponse){

                               $("#response").html(theResponse);
                               $("#response").slideDown('slow');
                               slideout();  

                          }); 

                     }  

                }).disableSelection();
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文