动画过程中不触发事件（不使用Jquery）

Question

用d3.js制作图表过程中需要使用css动画，动画通过onclick事件触发。但是发现，在动画执行过程中点击元素，会再次触发onclick事件，导致动画执行的暂停。于是想通过先取消事件绑定，动画执行完毕后再重新绑定，但是发现无法解绑onclick事件。

    bars.append("rect")
         .on("click",function(d){
             var  that = this;
             return setTimeout(function(){
                //实际上发现下面的语句无法取消onclick事件？why
                that.__onclick = null;
                d3.select(that)
                    .attr("x",100)
                    .attr("width",50)
                    .transition()
                    .duration(1000)
                    .attr("width",1000)
                    .attr("x",0)
                    .transition()
                    .duration(200)
                    .attr("x",100)
                    .attr("width",50);
                },0);
            })

Answer 1

楼主可以自己加一个判定，当动画开始且时间小于动画时间的时候内，不允许再次触发点击事件（即暂时性禁用）。当动画时间过去后，才解锁点击效果。这样应该可以变相的解决楼主所述的这个问题