Ajax JavaScript 复选框更改不起作用

ajax javascript check box change not working

本文关键字：不起作用 复选框 JavaScript Ajax      更新时间：2023-09-26

我正在使用以下 ajax javascript 来传递值，如果复选框是否被选中， 我面临的问题是它仅适用于 mysql 获取 aray 的第一行，对于其余结果，它总是发送复选框状态 = 1 作为结果，无论是否选中 chekbox。 这是代码： 

<script>
 $(document).ready(function(e) {
   $('input[name=status]').change(function(){
    if( $('input[name=status]').prop('checked') )
       {checkboxstatus = '1';}
       else
       {checkboxstatus = '0';}
        var idm = $(this).attr('idm');
        $.ajax({
        type: "POST",
        url: "checkboxtestbackend.php",
        data: {"checkboxstatus": checkboxstatus,
        "idm":idm 
       },
        })        
        .fail(function(jqXHR, textStatus, errorThrown){alert(jqXHR+"--"+textStatus+"--"+errorThrown);});
    });//end change
  });//end ready
</script>

通常，如果我解开 checbox 它 POST 的 0 作为值，则在第一次 sql 获取中检查所有检查程序，但对于其余的 sql 获取结果，无论是否选中，它总是发送"1"作为 POST 结果。

这是显示复选框的代码：<?php echo "<input type='checkbox' idm='$idm' name='status'"; if($row['status'] == 1){print "checked='checked'"; }echo "/>";?>

复选框状态的可视化正在工作，但更改不起作用。

这是它的 sql 查询： 

$sql = "SELECT * FROM cursos ORDER BY id DESC";
if (!$result = mysqli_query($con,$sql))
{
    die("Error: " . mysqli_error($con));
}

<?php
while($row = mysqli_fetch_array($result))
{   
    $idm = $row['id'];
?>
<td align="center"><?php echo "<input type='checkbox' idm='$idm' name='status'"; if($row['status'] == 1){print "checked='checked'"; }echo "/>";?></td>
这对

我有用...

我把$('input[name=status]').prop('checked')改成了$(this).prop('checked').

<input type="checkbox" idm="stuff" name="status" value="1">
<input type="checkbox" idm="stuff" name="status" value="2">
<input type="checkbox" idm="stuff" name="status" value="3">  
<script>
 $(document).ready(function(e) {
$('input[name=status]').change(function(){
    if( $(this).prop('checked') ) {checkboxstatus = '1';}
                             else {checkboxstatus = '0';}
        var idm = $(this).attr('idm'); 
        $.ajax({
           type: "POST",
           url: "checkboxtestbackend.php",
           data: {"checkboxstatus": checkboxstatus, "idm":idm },
           success: function(response){
              console.log(response);  
             }
        })        
        .fail(function(jqXHR, textStatus, errorThrown){alert(jqXHR+"--"+textStatus+"--"+errorThrown);});
});//end change
});//end ready 
</script>

请尝试这个，

  $(document).ready(function(e) {
     $('.CheckBoxClass').click(function(){  // added class based event  
           if( $(this).is(':checked')) {
               checkboxstatus = '1';
             } else {
               checkboxstatus = '0';
              }             
             var idm = $(this).attr('idm');
                 $.ajax({
                     type: "POST",
                     url: "checkboxtestbackend.php",
                     data: {"checkboxstatus": checkboxstatus,
                        "idm":idm 
                        },
                 })        
             .fail(function(jqXHR, textStatus, errorThrown){alert(jqXHR+"--"+textStatus+"--"+errorThrown);});
            });//end click
     });//end ready

在PHP代码中，添加了class='CheckBoxClass' 

<?php   
    echo "<input type='checkbox' idm='$idm' class='CheckBoxClass' name='status'"; if($row['status'] == 1){ print "checked='checked'"; }echo "/>";
?>
相关文章：