如何在单击时获取复选框的值

Question

我有一个 html 表，每行都有一个动态创建的复选框。复选框的选中状态是根据数据库中的值设置的。当在 html 表中选中复选框时，我需要捕捉更改并设置值，以便如果选中该框，则 value=1 else value=0。值被传递给更新查询。我不确定如何用我当前的代码来完成这个。HTML：<?php     $sqlGetEmployees = "select e.employeeID, e.lastName, e.firstName, l.number, p.name, e.gradeCertLevel, e.serviceYears, e.step, e.certified from employee e join location l on l.locationID = e.locationID join position p on p.positionID = e.positionID";    $stmtGetEmployees = mysqli_prepare($db,$sqlGetEmployees);    mysqli_stmt_execute($stmtGetEmployees);    mysqli_stmt_bind_result($stmtGetEmployees, $id, $lastName, $firstName, $number, $name, $gradeCertLevel, $serviceYears, $salaryStep, $certified);    $count = 1;    while(mysqli_stmt_fetch($stmtGetEmployees))   {        $checkedCertified = ($certified == '1') ? 'checked="checked"':'';?>    <tr>        <!-- other table data -->        <td>             <div id='certified_<?php echo $id; ?>'>                <input contentEditable='true' class='edit' type='checkbox' id='certified' <?php echo $checkedCertified; ?> />            </div>         </td>    </tr><?php        $count ++;    }    mysqli_stmt_close($stmtGetEmployees);?>  脚本：    // Add Class    $('.edit').click(function(){        $(this).addClass('editMode');    });    // Save data    $(".edit").focusout(function(){        $(this).removeClass("editMode");        var id = this.id;        var split_id = id.split("_");        var field_name = split_id[0];        var edit_id = split_id[1];        var value = $(this).text();        $.ajax({            url: 'update.php',            type: 'post',            data: { field:field_name, value:value, id:edit_id },            success:function(response){                console.log('Save successfully');                           }        });    });

Answer 1

对于动态创建的元素，事件的处理方式如下：

$(document).on('click', '.edit', function(e) {

   //e.preventDefault();

   var checkedStatus = 0;

   if ($(this).is(':checked')) {

       $(this).addClass('editMode');

       checkedStatus = 1;

   } else {

       checkedStatus = 0;

       $(this).removeClass("editMode");

   }  

    var id = this.id;

    var split_id = id.split("_");

    var field_name = split_id[0];

    var edit_id = split_id[1];

    var value = $(this).text();

    $.ajax({

        url: 'update.php',

        type: 'post',

        data: { field:field_name, value:value, id:edit_id, checked: checkedStatus },

        success:function(response){

            console.log('Save successfully');               

        }

    });

});

要将所有内容放入单个事件处理程序中，您可以将所有内容放入 .click 或 .focusout 中，具体取决于您要实现的目标。