Chrome沒有在jQuery click事件上隱藏數據元素

Question

我正在嘗試在單擊事件中隱藏屬性為data-fineBin = "UNCLASSIFIED"一組元素。 它在IE和FF中工作正常，但不想在Chrome上工作。 知道可能缺少什么嗎？ 請注意，hidden是一個全局變量，在頁面加載時初始化為false。

$(document).on('click', '#toggle', function (event) {
    if(!hidden) {
        $('[data-fineBin="UNCLASSIFIED"]').hide();
        hidden = true;
    } else {
        $('[data-fineBin="UNCLASSIFIED"]').show();
        hidden = false;
    }
})

數據元素是使用d3.js生成的（部分內容請參見下文）。 我不確定這是否有幫助。

var circle = waferBox.selectAll("circle")
    .data(function(data) {return data.detailWafer;})
    .enter()
    .append("circle")
    .attr("cx", function(d) {
        var x = jsonScaleUp * makeNumber(d.x);
        return xScale(x);
    })
    .attr("cy", function(d) {
        var y = jsonScaleUp * makeNumber(d.y);
        return yScale(y);
    })
    .attr("r",3)
    .style("fill",function(d) {return d.color;})
    .attr("data-fineBin",function(d){
        if(d.fineBin) {
            return d.fineBin
        } else {
            return "null"
        }});

Answer 1

我試圖自己弄弄它，但在隱藏時遇到了未定義的錯誤。 無論如何，我建議下一種方法：

$('#toggle').click( function(){
$('[data-fineBin="UNCLASSIFIED"]').toggle();
});

Answer 2

我嘗試了很多選項仍無法在Chrome中使用它，因此我嘗試使用相同的切換按鈕按其類名稱來旋轉一組元素，並且該功能在所有平台上均有效。 因此，我更改了d3.js，以便將UNCLASSIFIED分配為類，然后切換這些元素。 在這種情況下，要切換的元素有100多個，我不確定是否在其中起作用。

 $('#toggle').click( function(){
    $('.UNCLASSIFIED').toggle();
});