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

Chrome不会在jQuery点击事件中隐藏数据元素

2 个答案: