D3 使用 classed() 添加和删除带有复选框的类

Question

我在删除使用复选框添加的类时遇到问题。首先选中该复选框。当用户取消选中它时，它会添加一个带有classed('hideRect'，true(的"hideRect"类; 这很好用，但是当我再次选中该框时，该类不会消失。

这是我的代码：

this.$node.append('input')
.attr('type', 'checkbox')
.attr('checked', true)
.attr('value', 'med')
.on('click', () => this.updateRectLine());
}
private updateRectLine() {
//var rect = this.$node.getElementsByClassName('.MEDICATION');
var cbMed = this.$node.attr("checked");
if (cbMed !== true){
this.$node.selectAll(".MEDICATION").classed('hideRect', true);
}
else if (cbMed == true){
this.$node.selectAll(".MEDICATION").classed('hideRect', false);
}

}

提前感谢！

Answer 1

您需要像这样更新以下函数

private updateRectLine() { 
var cbMed = this.$node.select("input[type='checkbox']").prop("checked");
if (!cbMed)
this.$node.selectAll(".MEDICATION").classed('hideRect', true);
else
this.$node.selectAll(".MEDICATION").classed('hideRect', false);
}

.attr()函数仅返回复选框初始化为的值，要检查复选框的检查状态，您需要使用复选框元素上存在的属性checked