选中复选框时更改列表元素的颜色

Question

好吧，我有一个表单，这个表单有各种输入框和一个用户可以决定检查的复选框。然后，用户可以单击表单上的提交，它被存储在数据库中，并在不同的页面上生成一个列表元素及其信息。

是否有根据是否选中复选框来更改生成的列表元素的颜色？

我知道有这样的代码：

$(":checkbox").on('click', function(){
 $(this).parent().toggleClass("checked");
});

但我不希望复选框的列表元素更改颜色，如果已在该表单内选中复选框，我希望表单的列表元素更改颜色。希望这是有道理的。可以这样做吗？

复选框的 HTML：

<li>
      <input type="checkbox" name="checkyes" id="checkyes" data-iconpos = "right">
      <label for="checkyes">Unpaid?</label>
</li>

根据表格中给出的信息生成列表元素：

db.transaction(function(transaction) {
    transaction.executeSql(
        'SELECT * FROM table1', [],
        function(transaction, result) {
            if (result != null && result.rows != null) {
                for (var i = 0; i < result.rows.length; i++) {
                    var row = result.rows.item(i);
                    $('#mylist').append('<li class = "inclist">'+'test'+'</li>');
                }
                $('#mylist').listview().listview('refresh');
            }
        }, 
        errorHandler
    );
}, errorHandler, nullHandler);

相对于表单，复选框位于表单内部。所以我在想，当我点击提交时，我应该以某种方式将复选框的值存储在数据库中，然后使用带有条件的 select 语句？

表单本身的 HTML 只是一系列带有输入框的列表元素。

Answer 1

使用更改而不是点击

$(":checkbox").on('change', function(){
 $(this).closest("desired element").toggleClass("checked");
});