我如何制作一个 cookie 来保存这些 div 标签的位置?
我正在使用 JQuery 来重新排序我的 div(代码如下),但我需要制作一个 cookie 来保存这些 div 的顺序。我看到很多网站都提出了 Javascript 的东西,但它通常会说诸如保存输入的名称之类的内容。我不知道如何去做这件事。
$().ready(function() {
$('.moveUpCls').click(function(event){
var current = $(this).parent().parent().parent();
current.prev().before(current);
});
$('.moveDownCls').click(function(){
var current = $(this).parent().parent().parent();
current.next().after(current);
});
});
每个可移动的 div 都遵循这种模式(div 上也有隐藏/显示,但暂时忽略它):
<div>
<div id="tabHeader">
<div id="headMoveUp"><a class="moveUpCls"><img src="images/uparrow.png"></a></div>
<div id="headMoveDown"><a class="moveDownCls"><img src="images/downarrow.png"></a></div>
<a href="javascript:toggle();"><div id="tabHeadText">Important Links »</div> </a>
</div>
<div id="toggleText" style="display:none; text-align:center;">
<div id="empGuide" style="text-align:center;margin-left:auto; margin-right:auto;">
CONTENT OF DIV
</div>
</div>
<br />
</div>
I am using JQuery to have the ability to reorder my divs (code below), but I need to make a cookie to save the order of these divs. I see alot of site coming up with Javascript stuff, but its usually saying things like save an inputted name and such. I have no clue how to go about doing this.
$().ready(function() {
$('.moveUpCls').click(function(event){
var current = $(this).parent().parent().parent();
current.prev().before(current);
});
$('.moveDownCls').click(function(){
var current = $(this).parent().parent().parent();
current.next().after(current);
});
});
Each moveable div follows this pattern (The div's also have hide/show on em, but ignore that for the time being):
<div>
<div id="tabHeader">
<div id="headMoveUp"><a class="moveUpCls"><img src="images/uparrow.png"></a></div>
<div id="headMoveDown"><a class="moveDownCls"><img src="images/downarrow.png"></a></div>
<a href="javascript:toggle();"><div id="tabHeadText">Important Links »</div> </a>
</div>
<div id="toggleText" style="display:none; text-align:center;">
<div id="empGuide" style="text-align:center;margin-left:auto; margin-right:auto;">
CONTENT OF DIV
</div>
</div>
<br />
</div>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
我会使用 JSON 表示您的布局,但请注意,cookie 只能保存 4K 数据。您最好将其存储在服务器上或使用本地存储。
I'd use a JSON representation of your layout, but beware, cookies can only hold 4K of data. You're best storing it on the server or using local storage.
根据排列的数量,您可以在 jquery 代码中创建键->值对的哈希,其中每个值都是 div 的排序,键是您在 cookie 中存储的内容。
Depending on the number of permutations, you could create a hash of key->value pairs in your jquery code, where each value would be an ordering of the the divs, and the key would be what you store in the cookie.