Question

我的主要目标是为每个SVG元素（使用Raphael JS lib创建）进行鼠标右键单击检测，我的html代码看起来非常简单：

<head>
 ...
 <script type="text/javascript" src="/side_media/js/raphael.js"></script>
 <script type="text/javascript" src="/side_media/js/MyScript.js"></script>
</head>
<body>
...
 <div id="canvas_container">
</body>

我的JS包含

window.onload = function() {
 var paper = new Raphael(document.getElementById('canvas_container'), 900, 400);
 ...
surface[1] = paper.path('m150,150l40,0l0,20l-40,0l0,-20z');
surface[2] = paper.path('m150,150l-10,-20c20,-17 40,-17 60,0l-10,20l-40,0z');
surface[3] = paper.path('m190,170l10,20c16,-20 16,-40 0,-60l-10,20l0,20z');
surface[4] = paper.path('m190,170l10,20c-20,17 -40,17 -60,0l10,-20l40,0z');
surface[5] = paper.path('m150,150l-10,-20c-16,20 -16,40 0,60l10,-20l0,-20z');
for(i=1;i<=5;i++)    
  fill[i]=surface[i].attr({fill:'#FFFFFF'});

//each element has its own url activated on click (LMB)
toothfill[1].click(function (){window.location="http:...";});
...
}

我也试过很多（在网上可以作为例子）JS脚本显示人民币点击的一些菜单，它看起来可以将这个人民币菜单仅限于某些选定的html DIV类（如果不是，请警告我！），所以我现在的问题是：如何将那些“填充”数组元素放入单独的DIV中，它们将共享同一个类？

如果还有其他更简单的方法 - 我开放:) 非常感谢，提前，鲍里斯塔拉

我想知道是否可以将每个SVG元素放入单独的DIV中，只是？我想

Answer 1

我不明白为什么你需要将svg包装在div中以检查按下了哪个鼠标按钮。

尝试这样的事情：

toothfill[1].click(function (evt){ 
  if (evt.button == 0) {
    // left mouse button pressed
  } 
  else (evt.button == 1) {
    // right mouse button pressed
    evt.preventDefault(); // prevent right-click menu from appearing
  }
});

这是来自DOM 3 Events的click Event对象的reference。如果您不知道它是什么，请阅读Event.preventDefault。

如何将SVG元素（使用Raphael JS lib创建）放入DIV元素（进行人民币点击管理）

1 个答案: