听右键点击 svg 元素与 Raphael.js
Listen to rightclick on svg element with Raphael.js
当用户右键单击使用Rapahel.js创建的元素时,我需要做出响应。我读到您应该只附加一个单击事件处理程序,然后决定用户单击哪个鼠标按钮。我无法让这个工作。
<!DOCTYPE html>
<html>
<head>
<script src="http://raphaeljs.com/raphael.js"></script>
<script>
window.onload = function() {
var r = Raphael('demo', 640, 480);
r.rect(10, 10, 400, 400).attr({fill: 'red'}).click(function(){
alert('test');
});;
};
</script>
</head>
<body>
<div id="demo"></div>
</body>
</html>
警报框仅在单击鼠标左键时显示。关于单击右键时如何显示警报框的任何建议?
我已经在jQuery上看到了这个小技巧:
$(r.rect(10, 10, 400, 400).attr({fill: 'red'}).node).bind('contextmenu', function(){
alert('test');
});
但也请阅读有关它的评论:
是的,这也有效,但仅适用于jQuery,而且最好不要使用.node, 因为 Raphael 有时会重新创建节点 - 所以你会丢失你的事件处理程序。
您可以使用
mousedown
并测试e.which
。这适用于FF和Chrome:
var r = Raphael('demo', 640, 480);
r.rect(10, 10, 400, 400).attr({fill: 'red'}).mousedown(function(e){
if (e.which == 3)
alert("hi")
});
对于跨浏览器解决方案,您可能还需要查看e.button
:
http://www.quirksmode.org/js/events_properties.html#button
相关文章:
- 将用户制作的SVG(raphael.js)发送到服务器(php),以便通过电子邮件发送
- 设置1400个Raphael.js对象的不透明度动画会影响动画性能
- Raphael.js条形图及教程
- in Raphael JS
- 使用Raphael js直接在谷歌地图上绘制
- Raphael JS事件未开火
- Raphael JS+点击处理程序
- jQuery, jScrollPane and Raphael JS
- D3/Raphael js 以慢帧率绘制 1000+ 动画圆圈
- Raphael JS:如何从 Dom 对象(Element.node)获取 Raphael 元素
- 隐藏 Raphael JS Freetransform 上的手柄,但继续拖动
- Raphael JS选择路径/对象/节点的特定实例
- 使用raphael.js重新渲染时内存泄漏
- Raphael JS中的动画字体大小是否有流畅的转换可能性
- 如何在Raphael js中在屏幕(浏览器)的边缘画一条线
- 关于Raphael js拖放的解释
- 在Raphael JS中创建脉动(循环)背景的最简单方法
- 在Raphael JS中,不透明度:0和开始动画到不透明度:1之间的延迟
- 使用Raphael.js可以相对定位一个元素,然后将其偏移一个绝对单位
- 用Raphael.js延缓元素的去除