gpt4 book ai didi

javascript - Gridster - 保存 div 的 html 内容以动态加载网格

转载 作者:数据小太阳 更新时间:2023-10-29 06:11:58 25 4
gpt4 key购买 nike

我已经用 gridster 做了一些测试,我可以保存一些 gridster 数据,比如坐标、大小、ids 等。

但我无法保存填充 gridster 的 div 的内容,我可以稍后加载每个元素的 gridster 坐标。

这是我的代码:

<script type="text/javascript">
$(document).ready(function () {
var grid_canvas = $("#homepage > #grid").gridster({
widget_margins: [10, 10],
widget_base_dimensions: [140, 140],
widget_selector: ".gs_w",
shift_larger_widgets_down: false,
serialize_params: function($w, wgd) {
return {
id: $($w).attr('id'),
col: wgd.col,
row: wgd.row,
size_x: wgd.size_x,
size_y: wgd.size_y,

};
},
draggable: {

stop: function(event, ui) {

var positions = JSON.stringify(this.serialize());

$.post(
"process.php",
{portlets: positions},
function(data){
var resultado = jQuery.parseJSON(data);
$("#result").html(resultado)
}
);
}
}
}).data('gridster');
});
</script>
</head>
<body>
<div id="homepage">
<div id="grid" style="height: 480px; position: relative; width:480px; ">
<div id="protlet-1" data-row="1" data-col="1" data-sizex="1" data-sizey="1" class="gs_w"><div>Test-one</div></div>
</div>
</div>
<div id="result"></div>

这里是我的 process.php:

<?php echo $_POST["portlets"];?>

我可以提取该 div 中除 html 内容以外的所有内容,以便稍后动态重新创建。

谁能帮帮我?

谢谢

最佳答案

在做serialize_params的时候,也要抓取html内容。这是一个simple example显示相同。

serialize_params: function($w, wgd) 
{
return {
id: $($w).attr('id'),
col: wgd.col,
row: wgd.row,
size_x: wgd.size_x,
size_y: wgd.size_y,
htmlContent : $($w).html()
};
}

当您遍历 JSON 时,您将必须构建结构。然后调用 gridster 方法。

关于javascript - Gridster - 保存 div 的 html 内容以动态加载网格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18970385/

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