如果 AJAX 错误，请取消选中复选框 [重复]

Posted 2023-03-10

【中文标题】如果 AJAX 错误，请取消选中复选框 [重复]

【英文标题】：Uncheck checkbox if AJAX error [duplicate]

【发布时间】：2017-12-27 02:16:23

【问题描述】：

我在第一列中有一个带有复选框的表 - 选中后，它将执行一个 AJAX 脚本，该脚本使用选定的值更新 php 会话变量。如果出现 AJAX 错误，我希望复选框保持未选中状态 - 目前，当脚本出现 AJAX 错误时，它将保持选中状态。

这是表格和脚本：

$(document).ready(function() 
  $("input.select-item").click(function() 
    var productID = $(this).val();
    // Create a reference to $(this) here:
    $this = $(this);
    $.post('productSelections.php', 
      type: 'updateSelections',
      productID: productID,
      selectionType: 'single'
    , function(data) 
      data = JSON.parse(data);
      if (data.error) 
        var ajaxError = (data.text);
        var errorAlert = 'There was an error updating the Product Selections';
        $this.closest('td').addClass("has-error");
        $("#updateSelectionsErrorMessage").html(errorAlert);
        $("#updateSelectionsError").show();
        return; // stop executing this function any further
       else 
        $this.closest('td').addClass("success")
        $this.closest('td').removeClass("danger");
      
    ).fail(function(xhr) 
      var httpStatus = (xhr.status);
      var ajaxError = 'There was an error updating the Product Selections';
      $this.closest('td').addClass("danger");
      $("#updateSelectionsErrorMessage").html(ajaxError);
      $("#updateSelectionsError").show();
    );
  );
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<table class="table table-condensed table-striped table-bordered">
  <thead>
    <th><input type="checkbox" class="select-all checkbox" name="select-all" /></th>
    <th class="text-center" scope="col">Product ID</th>
    <th class="text-center" scope="col">Description</th>
  </thead>
  <tbody>

    <tr class="" id="85799">
      <td id="AT36288"><input type="checkbox" class="select-item checkbox" name="select-item" value="AT36288" /></td>
      <td>AT36288</td>
      <td>Apples</td>
      <td></td>
    </tr>
    <tr class="" id="85800">
      <td id="AT36289"><input type="checkbox" class="select-item checkbox" name="select-item" value="AT36289" /></td>
      <td>AT36289</td>
      <td>Bananas</td>
      <td></td>
    </tr>
    <tr class="" id="85801">
      <td id="AT36290"><input type="checkbox" class="select-item checkbox" name="select-item" value="AT36290" /></td>
      <td>AT36290</td>
      <td>Oranges</td>
      <td></td>
    </tr>
    <tr class="" id="85803">
      <td id="AT36292"><input type="checkbox" class="select-item checkbox" name="select-item" value="AT36292" /></td>
      <td>AT36292</td>
      <td>Grapes</td>
      <td></td>
    </tr>
  </tbody>
</table>

我正在添加一个错误类来将红色着色并显示警报，但如果可能的话，我想防止复选框保持选中状态。

【问题讨论】：

使用$().attr("checked",)***.com/a/17420580/2311317重复

我建议将 jQuery 版本从 1.2.6 更新到更新

【参考方案1】：

你可以尝试ajax失败块中的任何一个

$this.attr('checked', false);
$this.prop('checked', false);
$this.removeAttr('checked');

【讨论】：

那么哪个是正确的？

取决于 jquery 版本 $this.prop('checked', false); // 将是我的建议