gpt4 book ai didi

javascript - jquery-ui draggable 和 dynamic Jquery-ui draggable?

转载 作者:可可西里 更新时间:2023-11-01 02:54:48 25 4
gpt4 key购买 nike

这是我从 http://jqueryui.com/demos/draggable/ 中获取的代码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Draggable - Default functionality</title>
<link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
<script src="../../jquery-1.6.2.js"></script>
<script src="../../ui/jquery.ui.core.js"></script>
<script src="../../ui/jquery.ui.widget.js"></script>
<script src="../../ui/jquery.ui.mouse.js"></script>
<script src="../../ui/jquery.ui.draggable.js"></script>
<link rel="stylesheet" href="../demos.css">
<style>
.draggable { width: 150px; height: 150px; padding: 0.5em; }
</style>
<script>
$(function() {
$( ".draggable" ).draggable();
$('.content').click(function(){
var htmlData='<div class="draggable ui-widget-content ui-draggable"><p>Drag me around</p></div>';
$('.demo').append(htmlData);
});
});
</script>
</head>
<body>
<div class="demo">
<div class="draggable ui-widget-content">
<p>Drag me around</p>
</div>
<div class="content">Test </div>
</div><!-- End demo -->
</body>
</html>

我正在动态制作可拖动组件,正如您在函数 iam 中使用追加看到的那样。但是新生成的 drggable 对象并没有拖动,尽管我已经给出了 jquery-ui 生成的类。

最佳答案

添加动态创建的元素后,尝试调用 $( ".draggable").draggable();

$(function() {
$( ".draggable" ).draggable();
$('.content').click(function(){
var htmlData='<div class="draggable ui-widget-content ui-draggable"><p>Drag me around</p></div>';
$('.demo').append(htmlData);
$( ".draggable" ).draggable();
});
});

Working Demo

关于javascript - jquery-ui draggable 和 dynamic Jquery-ui draggable?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7660606/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com