我们可以使用JavaScript来解决这个问题。假设我们有一个API,可以返回一组复选框并标记已选中的复选框。我们可以使用以下代码来实现:
HTML代码:
JavaScript代码:
//假设API返回以下数据
let apiData = {
check1: true,
check2: false,
check3: true
};
//找到所有的复选框
let checkboxes = document.querySelectorAll('#checkboxGroup input[type="checkbox"]');
//用API数据标记复选框
for (let checkbox of checkboxes) {
if (apiData[checkbox.id]) {
checkbox.checked = true;
}
}
//添加事件监听器以更改状态
for (let checkbox of checkboxes) {
checkbox.addEventListener('change', function() {
apiData[this.id] = this.checked;
});
}
这段代码首先找到了所有的复选框,并使用API数据标记了复选框。然后,它添加了一个事件监听器,以便在用户与复选框交互时,更改API数据和复选框状态。