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 に答える