保留复选框状态

Question

我有一个问题，在菜单栏上单击时，选中的复选框丢失了。 如果选择零食

零食->吹气--->蔬菜--->并选中所有复选框

最后，如果我们单击“饮料”。

问题在于，“零食”下选中的复选框不会被重新绑定。

请在这里查看jsfiddle

http://fiddle.jshell.net/K646y/4/

请让我知道如何记住在这种情况下选中的复选框？

Answer 1

我想您想做的是这样的：
演示： http : //fiddle.jshell.net/9rJpJ/7/

在您的代码中：

random_number += 1;
....
"<input type='chackbox' id='"+random_number+"'  ..>"

这意味着id不是静态的，并且不方便存储chackbox状态。 所以我使用循环计数器i和k更改为static：

 var cb_id = 100*(i+1) + k;
 ....
 "<input type='chackbox' id='"+cb_id +"'  ..>"

并单击ckeckbox时保存状态：

// declare variable in the global scope.
var cbstatus = {}; 

// set event handlers
$('.checkboxclas').click(function(){
    var cbid=$(this).attr('id');
    var status = $(this).prop('checked');
    cbstatus[cbid] = status;
    console.log(cbstatus);
});

在创建复选框时，您可以像这样进行操作：

  var str_checked = "";
  if(cbstatus[cb_id]){
      str_checked = "checked";
  }
 ....
 "<input type='chackbox' id='"+cb_id +"'  "+str_checked+">"

希望这可以帮助。