オブジェクトが持つ属性を一覧表示できるjquery関数はありますか?私はそれを使用して、属性「fill」を設定できない理由を確認しようとしました
$(document).ready(function(){
$('#emitterButton').click(function(){
$(this).attr({'fill':BUTTON_COLOR_PRESSED});
});
});
。参考までに、を#emitterButton
参照してください
emitterButton = canvas.circle(emitter_center_x,emitter_center_y,BUTTON_RADIUS)
.attr({'fill':BUTTON_COLOR_UNPRESSED})
.attr({'id':'emitterButton'});
、ここで、canvasはRaphaelキャンバスです。
ノードラッピングオブジェクトの2つのフレーバーに混乱しているようです。あなたのコードでemitterButton
は、Raphaelオブジェクトを参照しています-によって作成されcanvas.circle
、attr
その状態を変更するために利用可能なメソッドとして持っています。
しかし、イベントハンドラー内で、オブジェクト$(this)
を提供しますjQuery
。偶然にも、attr
メソッドもありますが、対応するイベントをトリガーせずに、基になるDOMノード属性のみを変更します。
解決策は、id
(RaphaelのPaper.getById(id)メソッドを使用して)対応するオブジェクトを再度見つけることです。
$('#emitterButton').click(function(){
canvas.getById('emitterButton')
.attr({'fill':BUTTON_COLOR_PRESSED});
});
...または、場合によってははるかに優れた方法として、オブジェクトをキャッシュするだけです。
$('#emitterButton').click(function(){
emitterButton.attr({'fill':BUTTON_COLOR_PRESSED});
});
最後になりましたが、間違いなく重要なことですが、クリックハンドラーをRaphaelのオブジェクトにアタッチするだけです(Element.click()メソッドを使用)。
これにより、コードの実際の問題が解決されます。)完全を期すために、元の質問への答えは簡単です。jQueryオブジェクトがに格納されている場合は$el
、次の表記でその属性のリストにアクセスできます。
$el[0].attributes
...これによれば、ドキュメント、そのノードに関する任意の情報を表す文字列のキーと値のペアです。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加