Javascript onchangeの挙動がIEとFirefox,Chromeで違う
ラジオボタンやセレクトボックスにonchangeとしておいて、要素が変わったら処理をする、としていると、IE系とFirefoxやChromeで挙動が違うので、注意が必要です。
jQueryを利用して、次のようなonchangeで変わるラジオボタンを作っておくとします。
//jQueryは先に読み込んでおいてください。 //scriptタグなどで記述 function update_fruit_id(theForm) {
var val=$(“input:radio[@name=’division_id’]:checked”).val();
if (val==2){
alert('いちごだよ');
}else if(val==1){
alert('めろんだよ');
} } //中略 <input name="fruit_id" value="1" id="fruit_id" onchange="update_fruit_id(this.form);" type="radio"> メロン <input name="fruit_id" value="2" id="fruit_id" onchange="update_fruit_id(this.form);" type="radio"> いちご
としていると、IEとFirefoxでまったく違う結果になってしまいます。
これは、Firefoxではラジオボタンをクリックしたときにonchangeが発生しているようですが、IEでは違うラジオボタンをクリックしたときにonchangeが発生しているからのようです。
残念ですが、onclickで呼び出したほうが、解決が早そうです…。