3

我对jQuery .data()Raphael 的 SVG path()有疑问。

我写了一个小例子来解释。

paper = Raphael(0, 0, 600, 600)
polygon = paper.path('M19,20L24,83L106,62L112,23Z')
polygon.data('test', 'I need this info later!')
polygon.attr({"fill":"orange"})

$(document).on('click', onClick)

function onClick() {
    console.log('click')
    if(event.target.nodeName === 'path') {
        // how do i get data('test') ?

        // console.log(this.data('test')) // Uncaught TypeError: Object #<HTMLDocument> has no method 'data' 
        console.log($(this).data('test')) // undefined
        // console.log(event.target.data('test')) // Uncaught TypeError: Object #<SVGPathElement> has no method 'data' 
        console.log($(event.target).data('test')) // undefined

        // But jquery.remove() does work?
        $(event.target).remove()

    }
}

如您所见,我制作了一个多边形,用颜色填充它,并在文档中添加了一个事件侦听器。每次单击时,我都会检查目标。如果这是一个多边形,我想获取它的数据。

请注意,在我的真实代码中,我生成了大量这样的多边形。所以一个简单的polygon.data()不会有帮助。我唯一的解决方案是使用 event.target 作为参考。 多个多边形的示例

如何接收数据值?

4

1 回答 1

2

你很接近,你只需要包装在 jquery 对象中的节点首先设置数据:

$(polygon.node).data('test', 'I need this info later!');

我更新了您的jsfiddle以显示它可以正常工作。

于 2013-03-01T14:26:52.223 回答