jquery モバイル チェックボックス グループを動的に作成しました。イベントをバインドして、すべての機能を選択できるようにします。実行すると、Chrome コンソールに「Uncaught TypeError: Cannot call method 'removeClass' of undefined」と表示されます。js コードは次のとおりです。
var arr=['<fieldset id="countryContainer" name="countryContainer" data-role="controlgroup" data-type="horizontal">'];
arr.push('<input type="checkbox" id="country_all" name="country_all" value="all" /><label for="country_all">ALL</label>');
for(var i=0;i<9;i++){
arr.push('<input type="checkbox" id="country_'+i+'" name="fe" value="'+i+'" /><label for="country_'+i+'">'+i+'</label>');
}
arr.push('</fieldset>');
$('[name=cell1]').append(arr.join(''));
$.mobile.pageContainer.trigger("create");
var chkall=$('[name=country_all]');
chkall.on('change', function() {
var checked=(chkall.prop('checked')=="checked")? true:false;
$("#countryContainer").prop('checked',true).checkboxradio().checkboxradio("refresh"); //something goes wrong here.
});
そしてhtml:
<table>
<tr>
<td id="j_9" name="cell1" class="mobilegridcell1" colspan="1" rowspan="1"></td>
</tr>
</table>
問題は、country_all チェックボックスを選択して、countryContainer のすべてのチェックボックスを選択したいということです。何か案は?