jquery-ui-draggable - 如何移动附加的 div?
问题描述
我有这个代码:
<div id="plan">
<div id="" class="move circle pe">1</div>
</div>
$('.move').draggable({
containment: '#plan',
stop: function(e, ui) {
var offset = $(this).offset(),
x = offset.left,
y = offset.top;
//callback will be here
alert("posição x: " + x + " posição y:" + y);
}
});
我可以移动带有数字 1 的 div,但是当我生成一个新的 div
function createStation(station){
number = window.prompt("Escolha o numero para o posto");
id = station+number;
$("#plan").append("<div id='"+id+"' class='move circle pe'>"+number+"</div>");
}
div 出现,但我无法移动它。我需要让它移动但也要提醒它的位置(未来回调)
请检查jsfiddle:
解决方案
我会为绑定创建一个额外的函数,例如draggable()
在你重新绑定类的每个新项目move
上draggable()
;
添加了一个功能dragger()
function dragger() {
$('.move').draggable({
containment: '#plan',
stop: function(e, ui) {
var offset = $(this).offset(),
x = offset.left,
y = offset.top;
//callback para salvar em php
alert("posição x: " + x + " posição y:" + y);
}
});
}
推荐阅读
- javascript - 如何在有限的函数中执行这个结果
- r - 使用不同的组规则自动执行 group_by 函数
- java - Java一次从一组中获取n个项目
- php - 如何在 Laravel 8 中每次在同一个 cookie 中插入多个值
- google-bigquery - 总结时间范围内的字数
- python - pmdarima 的 auto_arima 如何计算袋外错误?
- node.js - 如何在 Sapper 中使用 mysql2 库?
- netlify - 如何在现有网站上托管 netlify 应用程序?
- php - 为什么使用此 PHP 代码在 Sqlite3 数据库中没有写入任何内容?
- 3d - 如何使用godot 3d网格?