チェックボックスのイベントハンドラがクロムのclickイベントでエラーをスローすると、safariはキーボードイベントでうまく動作します

Question

私は動的に作成されたチェックボックスのリストを持っています。チェックボックスの状態が変わると機能が実行されます。ユーザーがチェックボックスをクリックするか、キーボード入力を使用してチェックボックスを変更するかに関わらず、関数は完全にfirefox 3.6で完全に実行されます。クロムまたはサファリでは、関数はキーボードを使用して正常に実行されますが、マウスのクリックでエラーが発生します。私はなぜコードがマウスのクリックとキーボードの入力と異なる動作をするのか分からない。ここ

は私が適切なコードであると考えているものです：

var q_id = $j('label:contains("SCORP Statewide Need ")').attr('for'); 
console.log(q_id); //writes out answer id a_721 

Ajaxのポストは、チェックボックスのリストを作成します。

if(found == true){ 
    output+="<div name='"+q_id+"'><input type='checkbox' name='"+q_id+"' id='"+q_id+"."+i+"' class='check' checked='checked' onChange='saveStateNeed("+q_id+")' value='"+list[i]+"'/>"; 
}else{ 
    output+="<div name='"+q_id+"'><input type='checkbox' name='"+q_id+"' id='"+q_id+"."+i+"' class='check' onChange='saveStateNeed("+q_id+")' value='"+list[i]+"'/>"; 
} 
output+=" <label name='l_"+q_id+"' for='"+q_id+"."+i+"' id='l_"+q_id+"."+i+"'>"+ list[i] +"</label></div>"; 
output+="<div class='clearboth'></div><br/>"; 
$j('##div_'+q_id).append(output); 

このすべては、すべてのブラウザで完全に生成されます。 エラーはコールバックのsaveStateNeed（）にあります。

function saveStateNeed(list){ 

    console.log('in saveStateNeed'); 


    console.log(list);// prints out an array of the checkboxes [input#a_721.0.check Non-motorized trails, input#a_721.1.check Sports a...ayfields, input#a_721.2.check Land Acq...projects, input#a_721.3.check Picnicki...cilities, input#a_721.4.check Nature s...wildlife] 

      // **in safari i get function()** but it still works with keyboard, fails with click 
      // the next assignment $me fails. 

    var $me = $j('input [name="'+list+'"]'); 
    var isChecked = $me.context.activeElement.checked; 
    var $value = $me.context.activeElement.attributes['value'].nodeValue; 


    console.log($me); out puts the object selected as an expandable firebug object [] 



    console.log($value); outputs label for object: Picnicking/day use facilities 


    console.log(isChecked); outputs true false 

    if(isChecked){ 
    }else{ 

    } 

    $j.ajax({ 
     type: "POST", 
     url:  }); 

} 

これはちょうど私が同じコードが実際に実行され、[OK]をクリックしますキーボード入力、異なる結果になるだろう、なぜ誰もが知っている望んで複雑、IMのすべての種類です。 私は本当にこれがすべてあまりに複雑ではないことを願っています。 これを見ていただきありがとうございます。本当にありがとうございました。 歓声。

Answer 1

明示的な割り当てではなく、委任されたイベントとしてチェックボックスの動作をアタッチした方がよい場合があります。

あなたがそうのようにそれを行うことができますので、jQueryのを使用しているように見えます：saveStateNeed関数内でエラーがイベントハンドラであることを確信している、とではない：

$j('input.check').live('change', function(event) { 
    var jThis = $j(this); 
    // grab id from checkbox 
    var ID = jThis.attr('id').split('.')[0]; 
    saveStateNeed(ID, jThis.attr('checked')); 
    return true; 
}); 

をも？

EDIT：あなたのアップデートに基づいて、ここに私が持っているものがあります。まず、上記の関数のマイナーチェンジに注意してください。今は2つの値を渡します。次に、チェックボックスをトグルして動作させたい場合は、saveStateNeedにIDとブール値の2つの値を受け入れるように変更します。ように：

function saveStateNeed(ID, bChecked) { 
    console.log('checkbox ' + ID + ' is ' + (bChecked) ? 'checked' : 'not checked'); 

    if(bChecked) { 
     // do something 
    } else { 
     // do something else 
    } 
}