Question

我使用rahaeljs动态生成一些方块。这些方块有一个事件处理程序。当我尝试操作样式时，它会失败，具体取决于attr（）我尝试设置：

  function changeColor(obj) { 
      return function() { 
          obj.attr({cursor : 'pointer'}); 
      } 
  } 



   var main = function () {

    var width = 901;
    var height = 868;
    var space = 50;

    var paper = Raphael('paper', width, height);


    for (var y = 0; y < height; y += space) { 
        for (var x = 0; x < width; x += space) { 
            var r = paper.rect(x, y, space, space);
            r.attr({fill : 'transparent'})
            r.click(changeColor(r));


          } 
     } 

    };

    window.onload = main;

如果我将光标设置为{cursor：'pointer'}，如果我尝试用obj.attr（{fill：'＃ff00ff'}）更改填充颜色，这样可以正常工作;在changeColor函数中，没有任何反应。控制台中也没有错误。

我正在使用最新版本的raphael。

有什么建议吗？

此致迈克尔

Answer 1

你会对这个答案感到非常好笑或非常沮丧......这个问题与透明填充属性有关。 SVG将完全透明的对象视为不可点击，让点击事件过滤到它们下面的图层。因此，您的矩形没有收到点击事件。

如果你不能将颜色设置为纯色，你至少可以给fill属性一个微小的，几乎无法察觉的alpha值：

r.attr({ fill: 'rgba(255,255,255,0.001)' } );

完成后，你应该重新开始营业！

新样式不适用于事件上的元素

1 个答案: