【发布时间】:2021-08-31 01:00:38
【问题描述】:
我有一个页面,一方面我有几个不同的对象,另一方面我有一个复选框网格,每个人都一样,但每个对象的值都是自定义的。
Obj A 可以选择框 1 和未选择框 2,
Obj B 可以选择框 1 和框 2
但网格方案本身对于所有对象都是相同的。
我需要能够将复选框值从一个特定对象复制到另一个对象并将我的工作保存在服务器端。
我创建了一个纯 JS 小书签,它将复选框网格的“已选中”的实际值保存到 sessionStorage 中:
javascript: var test = [];
var check = document.getElementsByClassName("CheckboxGrid");
for (var i = 0; i < check.length; i++) {
test.push(check[i].checked);}
sessionStorage.setItem('val', JSON.stringify(test));
我在同一页面上使用第二个书签来复制复选框网格的值:
javascript: var gridValues = sessionStorage.getItem('val'); //returns an array of Char
var i = 0;
var y = 0;
var checkboxes = document.getElementsByClassName("CheckboxGrid");
while (y<checkboxes.length)
{
if (gridValues[i] == 't')
{checkboxes[y].checked=true; y++; i++;}
else if (gridValues[i] == 'f')
{checkboxes[y].checked=false; y++; i++;}
else {i++;}
}
代码“有效”,这意味着在屏幕上我可以看到第二个网格上第一个网格的精确副本;问题是第二个小书签看起来只是在改变盒子的“外观”,而不是实际操作它们。
事实上,当我保存或单击复选框时,一切都会恢复到书签操作之前的状态。
我做错了吗?是否真的可以让小书签点击复选框并在页面上保留其更改,即使在以后的用户输入(例如点击另一个框)之后也是如此?
谢谢大家
【问题讨论】:
标签: javascript checkbox bookmarklet