IEで画像に付けたlabelタグが動作しない

最近はプログラム漬けのYu-ichiです

今回はフォームを作っている時に気がついた問題です。

以前はチェックボックスやラジオボタンを用意した際に

</p>
<p>&lt;label&gt;&lt;input type=&quot;checkbox&quot;&gt;ボタンA&lt;/label&gt;</p>
<p>

という感じで、<label>タグでくくってあげると
テキスト部分もクリック領域になって、クリックするとチェックが入っていたのですが
同じように画像で以下のようにやったところ・・・

<label><input type="checkbox"><img src="画像"></label>

IEだけなぜかチェックがつきません！

<label>にforを、<input>にidをつけてないから？？
（省略可能なので、手抜きあえて入れてませんでした）

なんて思い、追加してみたものの変わらず・・・。

そこで調べて見るとなんと、IEのバグ（仕様？）ということが判明！

しかも・・・

IE6からずっとあるそうなっ！|-｀*）　テヘッ

今までinput＋画像の組み合わせでlabelを使うことがなかったので気が付きませんでしたよ。

でも、以前どこかで動作しているのを見たことがあったので
解決方法はきっとあるはず！と探してみると思いのほかたくさんありました。

その中でもjQueryを使った方法がコードも少なく、今の環境に適していたので
早速導入してみたところ、問題なく動作するようになりました！

ちなみに、参考にさせていただいたサイトはこちら
http://logic.moo.jp/data/archives/826.html

ただ、こちらの環境ではprototype.jsとのコンフリクション回避のために少し手を加えています。
こんな感じに・・・

</p>
<p>jQuery(function($){<br />
$(function () {<br />
    if ($.browser.msie) {<br />
        $('label &gt; img').click(function () {<br />
            $('#'+$(this).parent().attr('for') ).focus().click();<br />
        });<br />
    }<br />
});<br />
});</p>
<p>

jQueryの1.7.2の環境でも正常に動作してます
同じような現象でお困りなら、ぜひ試してみてください！