D3使用分類（）使用複選框添加和刪除類

我無法刪除使用複選框添加的類。該複選框被選中以開始。當它被用戶取消選中時，它會添加一個「hideRect」類，並帶有分類（'hideRect'，true）; 這很有效，但是當我再次檢查這個盒子的時候，班級並沒有消失。D3使用分類（）使用複選框添加和刪除類

這裏是我的代碼：

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); 
    }

}

在此先感謝！

來源

2017-07-03 jrogers12

元素w /類'.MEDICATION'和複選框之間的關係是什麼？在函數的第一行中，嘗試記錄該選擇的值以查看它是否包含您期望的元素。 – anbnyc

嘿@anbnyc感謝您的回覆！我可以看到該類添加到控制檯中的正確元素，所以我知道它的目標是正確的選擇，但它不會刪除該類！ – jrogers12

想不到還有什麼問題。如果你可以提供一個可重現的例子（比如JSFiddle），那麼可以告訴更多。這可能不是相關的，但你可能希望三等於（'cbMed === true'）來檢查'else if'之後。 – anbnyc

您需要更新這個函數的這樣

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出現在複選框元素

來源

2017-07-03 20:40:05 Dummy

感謝您的回覆！ – jrogers12

D3使用分類（）使用複選框添加和刪除類

回答

相關問題