data()
メソッドと要素のdata
属性を混同しています。
このdata()
メソッドは、探している文字列ではなく、要素にアタッチされたデータの無関係なオブジェクトを返します。
解決策1-属性としてのデータ
例で探している値を取得するには、次のattr()
メソッドを使用して属性をクエリする必要があります。
$(".bar").hover(function(){alert($("#"+$(this).attr('data')));});
解決策2-オブジェクトとしてのデータ
このdata()
方法を使用すると、要素に情報を手動で添付できます。
$('.bar').data('data','foo');
$(".bar").hover(function(){alert($("#"+$(this).data('data')));});
この場合'data'
、要素のデータオブジェクト内のキーの単なる任意の名前であることに注意してください。data()
メソッドの詳細については、jQueryのマニュアルを参照してください
解決策3-オブジェクトおよびHTML5属性としてのデータ
あなたの本来の意図は、data
属性をHTML5データ属性としてクエリすることだったと思います。これは、jQueryのドキュメントによるとautomatically pulled in to jQuery's data object
。
ただし、HTML5仕様によれば、HTML5データ属性にはdata-
プレフィックスが必要であることに注意してください。したがって、例を機能させるために、属性に名前を付けることはできませんがdata
、data-something
。例えば:
<div class="bar" data-something="foo">...</div>
その後、jQueryのdata()
メソッドでアクセスできます。
$(".bar").hover(function(){alert($("#"+$(this).data('something')));});
jQueryはプレフィックスを自動的に削除するため、data-something
でアクセスする方法に注意してください。data('someting')
data-