我是Javascript和Jquery图书馆的新手,所以请耐心等待。
我通过在父div中添加新的div来操纵DOM,如下所示:
var newdiv = document.createElement('div');
var addTst = document.getElementById("tst");
addTst.appendChild(newdiv)
<div id ="tst">
//new divs will appear here
</div>
$("#tst div").draggable(); *//things I need to be draggable*
#tst div{
height:50px;
width:50px;
background:red;
margin:20px;
display:inline-block;
}
但是我试图使用Jquery UI来定位这些新元素并使它们可拖动。 (新的div在初始文档加载后由用户添加,而不刷新Jquery /页面)。 当然Jquery只加载一次所以在保持不可分割之后添加任何东西。
我已经有了一些AJAX,它正在加载数据很好,但它很长,我不想重新运行整个AJAX函数只是为了刷新父divs内容(假设AJAX可以用新的更新div内容)。
为了帮助说明我添加了一个小提琴: http://jsfiddle.net/YuGhj/2/
正如您所看到的,第一个红色框拖得很好,但是如果您使用按钮添加新的孩子,则它们不可拖动。
我很可能完全误解了jquery / AJAX的工作方式。
TL; DR 简而言之,我需要一种方法来定位第一页加载后动态添加的元素,并对它们应用拖动功能。我假设我需要以某种方式刷新div,而不会丢失任何内容。
谢谢!
答案 0 :(得分:0)
使用jQuery操作DOM要容易得多。这是创建div的代码,附加它,并在其上调用draggable
:
$('<div/>').appendTo('#tst').draggable();
很多人似乎误解了如何选择和约束工作。当你这样做时:
$("#tst div").draggable();
在行执行时找到与"#tst div"
匹配的所有元素,并在这些元素上调用draggable()
。添加新元素时,需要在新元素上调用draggable()
。之前的通话不适用。