gpt4 book ai didi

数据库查询后jQuery不可拖动

转载 作者:行者123 更新时间:2023-11-29 00:32:04 25 4
gpt4 key购买 nike

我有一个 div 板,它从数据库加载可拖动和可调整大小的内容。

我用这个代码来请求代码。

$MBId = $_GET['id'];///the id I get from the URL
if ($MBId != null)
{
$sqlmoodboard= "SELECT Content FROM Moodboards WHERE Id ='$MBId' ";
$result = mysql_query("$sqlmoodboard ");

while($row = mysql_fetch_array($result))
{
echo "<div id=\"print\">";
echo $row['Content'];
echo "</div>";
}
}

我从数据库中得到代码,看起来像

  <div class="ui-draggable sleep ui-resizable" style="position: absolute; left: 450px; top: 117px;">

<img src="/imgurl.jpg" class="center">

<div class="ui-resizable-handle ui-resizable-e" style="z-index: 90;"></div>

<div class="ui-resizable-handle ui-resizable-s" style="z-index: 90;"></div>

<div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 90;"></div>

页面上的来源。

 <div class="ui-draggable sleep ui-resizable" style="position: absolute; z-index: 1; left: 143px; top: 78px;">
<img src="/imgurl.jpg" class="center">
<div class="ui-resizable-handle ui-resizable-e" style="z-index: 90;">
</div><div class="ui-resizable-handle ui-resizable-s" style="z-index: 90;">
</div>
<div class="ui-resizable-handle
ui-resizable-se
ui-icon
ui-icon-gripsmall-diagonal-se"
style="z-index: 90;">
</div>

<div class="ui-resizable-handle
ui-resizable-e"
style="z-index: 90;"></div>
<div class="ui-resizable-handle ui-resizable-s" style="z-index: 90;">
</div>
<div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 90;">
</div></div>

在我的 <head>我有

<script>
$(document).ready(function()
{
$(".sleep").draggable();
$(".sleep").resizable();
});
</script>

图像是可拖动的,但我无法调整大小。

我用过

$(document).ready(function()
{ });

最后应该是http://jsfiddle.net/75PvA/4/但是在从数据库加载内容之后。

所以我知道在我“重置”可调整大小功能之前内容已加载。

请注意,我发布了一个类似的问题,但我问错了问题,所以我关闭了那个问题

我的解决方案

在保存到数据库之前,我已经更改了我的保存功能,我调用了 destroy(以删除可调整大小的)。

然后我将 div 保存到数据库。

然后我刷新页面以加载最新保存的文件,然后我使用 .resizable({aspectRatio: true})现在一切正常,但问题没有答案。

最佳答案

页面上有很多代码,因此尝试隔离问题和解决方案非常困惑。但是,我认为 jQueryUI 检测到 resizable CSS 类已经添加到您要调整大小的元素中。所以它没有添加任何事件处理程序。

所以你需要先完全删除所有的 jQueryUI 类:

$(".sleep").resizable('destroy')

首先,然后重新添加可调整大小的功能

$(".sleep").resizable({handles: 'e, s, se'})

但是,在重新添加 .resizable() 的元素上有一个 .click 事件,这打破了 south-east< 的位置 调整大小句柄。

同样的逻辑适用于 .draggable()。在尝试重新添加功能之前,需要先将其销毁。

当用户保存他们的图像而不是所有这些标记时,简单地存储图片的位置会容易得多。然后标记将是干净的(并且 jQueryUI 类是免费的)因此在干净的标记上调用 .resizable() 将按预期工作。

关于数据库查询后jQuery不可拖动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16078369/

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