Jquery ui“恢复”模态表单上的位置取消

Posted 2023-05-09

【中文标题】Jquery ui“恢复”模态表单上的位置取消

【英文标题】：Jquery ui "revert" position on modal form Cancel

【发布时间】：2013-06-04 23:33:16

【问题描述】：

我有一组可以拖动的元素（如果需要，可以拖放），当用户停止拖动操作时，我需要一个表单出现（通过拖动：停止或放下）来更新移动的对象，如果用户取消模态表单，我希望该项目“恢复”到用户从中拖动它的原始位置。所以似乎有几个选择：

对我来说，这是众所周知的“鸡和蛋”场景，我相信你会很快告诉我根本不是这样，但事实是这样：拖放成功，或者放下并“做使用revert:invalid时的东西”？

$("#draggable").draggable(  
 //revert: true, 
 revert: "invalid",//only works with drop
 cursor: "hand" ,
 grid: [ 44,0 ],
 axis: "x",                     
 cursor: "move",     
 stop: function(ev, ui)    
   //Do Something here??                          

       $( "#dialog-confirm" ).dialog(
          resizable: false,
          height:140,
          modal: true,
          buttons: 
             "Yep": function() 
                 $( this ).dialog( "close" );
                ,
             "Nope": function() 
              $( this ).dialog( "close" );
                   // ...or Do something here?
                
              
            );


       
    ); 

http://jsbin.com/olawas/1/edit

【问题讨论】：

您是否想过简单地从服务器刷新页面？

我做了，但似乎需要很多代码来重新初始化所有内容（这可能是我对 live/ready 缺乏了解）..但是这些元素有几件事情他们做了刷新将是一个挑战，字面的页面刷新会破坏用户体验

我相信这将是一个像 ui.draggable.draggable('option','revert',true); 这样的选项。或一些简单的东西，但我似乎无法将它拼凑起来..

【参考方案1】：

也许你之前也有过这样的想法，但是为什么你不保存 css top, left, bottom, right 来自“拖动”元素，在“拖动”事件和“开始”事件中，所以在停止时，您只需决定元素应该保留哪个。

It's something like this what you want to do ?

【讨论】：

这很好！它似乎在示例中运行良好，我将在今天实现它并在这里发布它是如何进行的。谢谢！考虑到他们在 revert:option:invlaid on drop 中投入了多少想法，我真的很惊讶 Jq-ui 中没有内置函数。再次感谢您的解决方案让我继续前进。