在父div中拖放

Question

我必须在其父div中拖动搜索框 例如： -

父div  儿童div

我必须在父div中拖动子div

请建议一些链接或回答

Answer 1

jQuery UI Draggable具有您需要的功能。所以，基本上你需要一个父.parent和一个可拖动的孩子，.child。

<div class="parent">
    <div class="child">Drag Me!</div>
</div>

然后调用脚本，并确保包含containment: "parent"以在其父级中包含它：

$(function() {
    $( ".child" ).draggable({ containment: "parent" });
});

要查看移动，您可以添加一些边框和高度。

.parent {width: 200px; height: 200px; border: 1px solid #999;}
.child {width: 50px; height: 50px; border: 1px solid #ccc;}

小提琴：http://jsfiddle.net/praveenscience/B2akk/

---

对于您的HTML，父级为#parent，可拖动的子级为#search。

<div id="parent">
    <div id="search"> </div>
</div>

相同的jQuery代码是：

$(function() {
    $( "#search" ).draggable({ containment: "#parent" });
});

小提琴：http://jsfiddle.net/praveenscience/ds4pv/