在事件处理函数(例如点击回调)中获取属性id
(或者基本上任何可以帮助我识别事件发生的元素的属性)的最佳(跨浏览器)方法是什么函数)的 snap.svg http://snapsvg.io/
这是一些代码。我尝试过的方法似乎适用于最新的 Chrome 和 FF,但我想知道是否有更好的方法。
//add an Element, set id
var mySvg = Snap('#mySvg');
var myRect = mySvg.rect(10,10,200,100);
myRect.attr({id:'myId'});
//register click callback
myRect.click(clickCallback);
//click callback
var clickCallback = function(event) {
// how do I get the id of the clicked element?
// is this cross browser valid?
var id = event.target.attributes.id.nodeValue;
};
最佳答案
我认为当前版本的 Snap 和 id 存在问题,该问题已在下一版本中修复(0.2 可能是当前版本)https://github.com/adobe-webplatform/Snap.svg/issues/166因此值得在某个时候阅读。
但是,在这些情况下我通常不会使用这样的 ID,我会使用“this”。因此,对于处理程序,它可能看起来像......
var mySvg = Snap(400, 620);
var myRect = mySvg.rect(10,10,200,100);
var clickCallback = function(event) {
this.attr({ fill: 'blue' });
};
myRect.click(clickCallback);
jsfiddle在这里http://jsfiddle.net/qgTdF/2/
此解决方案可能适合您,并且更可取,但这最终取决于您是否需要做其他事情(在这种情况下,可能会针对特定问题发布另一个问题)。如果您需要稍微调整一下并专门使用 id,那么也可能值得尝试最新版本(我认为是 0.2)。
关于javascript - 获取 snap.svg 中单击元素的 ID,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21337329/