jQuery class要素を盛り込むには

画像をマウスオーバーで変化させるコードを、こちらで教えていただいたアドバイスに従って以下の内容で行っています。

$(function(){
$('span img').hover(function(){
$(this).attr('src', $(this).attr('src').replace('.jpg', 'x.jpg'));
}, function(){
if (!$(this).hasClass('currentPage')) {
$(this).attr('src', $(this).attr('src').replace('x.jpg', '.jpg'));
}
});
});

BODY部分は、

<SPAN><IMG src="画像.jpg"></SPAN>

となっています。

けれど、よくよく考えると、マウスオーバーしたくない画像でも<SPAN>の中に記述していたらコードの影響をうけて、存在しない（マウスオーバー後の）画像を読み込もうとしてしまいます。

基本的な質問で申し訳ないのですが、
区別するため、例えば、マウスオーバーさせたい<SPAN>にはclass要素を入れて、

<SPAN class="change"><IMG src="画像.jpg"></SPAN>

としたとして、上記のコードの、

$('span img').hover(function(){

の辺りをどうにか変えればいいように思うのですがよくわかりません。

基本的すぎて申し訳ありませんが、よろしくお願いします。

No.1 ベストアンサー 回答者： mikemike7 回答日時： 2011/05/22 14:27

>どうにか変えればいいように思うのですがよくわかりません。

以下でいけるはずです。

$('span.change img').hover(function(){

この回答へのお礼

おおお！

できました！

私事ですが、$('span.change img') 部分の $() に入れるタグやクラス、IDの記述については、
ネットで調べると、””で囲んだり、''で囲んだり、
各区切りも （半角スペース）や . などいろいろでイマイチ、理解できていませんでした。

質問から間を開けず、最適な答えを簡潔に応えていただき、悩みが一瞬で晴れたようで感動しました。

ありがとうございました。

お礼日時：2011/05/22 14:51