如何创建拖放组件?

时间:2022-08-22 20:25:59

I want to create drag and drop components in my web page. For example in right side of the page input text box, radio button, checkbox should be available. Then I need to drag and drop these components to left side of the page.

我想在我的网页中创建拖放组件。例如,在页面右侧的输入文本框中,单选按钮,复选框应该可用。然后我需要将这些组件拖放到页面的左侧。

For this requirement which can be best suit.

对于这个最适合的要求。

I tried searching, suggestions like jQuery, Smart GWT, Ext JS. Which one will be feasible, even other than this too?

我尝试搜索,建议像jQuery,Smart GWT,Ext JS。哪一个是可行的,甚至除此之外呢?

Thanks,

谢谢,

Tried using jQuery drag and drop options. But these are played with original instance. But I'm looking for, after drag and drop even then the component should be avail for the next drag? Is it possible ??

尝试使用jQuery拖放选项。但这些都是用原始实例播放的。但我正在寻找,拖放后甚至那个组件应该可以用于下一次拖动?可能吗 ??

Thanks again.

再次感谢。

3 个解决方案

#1


1  

i think http://jqueryui.com/demos/draggable/ would be the most flexible solution in that case.

我认为http://jqueryui.com/demos/draggable/在这种情况下将是最灵活的解决方案。

#2


0  

Why don't you use HTML5 capabilities ?

为什么不使用HTML5功能?

http://html5demos.com/drag

http://html5demos.com/drag

#3


0  

You should be using "droppable" component in jquery UI

您应该在jquery UI中使用“droppable”组件

http://jqueryui.com/droppable/

http://jqueryui.com/droppable/

A droppable item is a draggable item by default.

默认情况下,可放置项是可拖动项。

 $( ".selector" ).droppable({
  drop: function( event, ui ) {
    //reset the position of "ui" element to initial position
    //add any new item in the place of dropped item
   }
});

#1


1  

i think http://jqueryui.com/demos/draggable/ would be the most flexible solution in that case.

我认为http://jqueryui.com/demos/draggable/在这种情况下将是最灵活的解决方案。

#2


0  

Why don't you use HTML5 capabilities ?

为什么不使用HTML5功能?

http://html5demos.com/drag

http://html5demos.com/drag

#3


0  

You should be using "droppable" component in jquery UI

您应该在jquery UI中使用“droppable”组件

http://jqueryui.com/droppable/

http://jqueryui.com/droppable/

A droppable item is a draggable item by default.

默认情况下,可放置项是可拖动项。

 $( ".selector" ).droppable({
  drop: function( event, ui ) {
    //reset the position of "ui" element to initial position
    //add any new item in the place of dropped item
   }
});