Javascript 选中所有复选框-打开和关闭切换

我有一个表，第一列中有一个复选框——选中该复选框时，将执行一个AJAX脚本，用选定的值更新PHP会话变量。我在第一列顶部还有一个复选框，允许用户选择表中的所有项目并执行AJAX脚本

我在“未选中时全选”状态下工作，即当页面首次加载时。我现在需要添加反向状态-取消选中页面上的所有复选框

以下是我的表格的外观以及单击表格标题中的复选框时运行的脚本：

$（文档）.ready（函数（）{
$（'.select all'）。在（'click'，function（）上{
var values=[]；//将包含您可以通过ajax发送的所有复选框值
$（'table>t正文输入[type=“checkbox”]”）。每个（函数（i，el）{
$（el）.prop（'checked'，true）；
推送值（el值）；
});
var productIDs=values.join（）；；
//在此处创建对$（this）的引用：
$this=$（this）；
$.post（'productSelections.php'{
键入：“updateSelections”，
productId:productId，
selectionType:“单个”
}，函数（数据）{
data=JSON.parse（数据）；
if（data.error）{
var ajaxError=（data.text）；
var errorAlert='更新产品选择时出错-'+ajaxError；
$this.closest（'td'）.addClass（“危险”）；
//显示AJAX错误详细信息
$（“#更新选择错误消息”）.html（错误警报）；
$（“#更新选择错误”）.show（）；
return；//不再执行此函数
}否则{
$this.closest（'td'）.addClass（“成功”）
$this.closest（'td'）。删除类（“危险”）；
}
}).失败（功能（xhr）{
var httpStatus=（xhr.status）；
var ajaxError='更新产品选择时出错-AJAX请求错误。HTTP状态：'+httpStatus+'。请与Apple Business Operations'联系；
$this.closest（'td'）.addClass（“危险”）；
$（“#updateSelectorMessage”）.html（ajaxError）；
$（“#更新选择错误”）.show（）；
$this.attr（'checked'，false）；//取消选中它
});
});
});

产品ID
描述
电话36288
苹果
电话36289
香蕉
36290
橘子
电话36292
葡萄
您只需检查复选框当前是否已选中


$（文档）.ready（函数（）{
$（'.select all'）。在（'click'，function（）上{
var values=[]；//将包含您可以通过ajax发送的所有复选框值
$（'table>t正文输入[type=“checkbox”]”）。每个（函数（i，el）{
//如果当前选中了复选框，请取消选中。
if（$（el.prop（'checked'））$（el.prop（'checked'，false）
else$（el）.prop（'checked'，true）；
推送值（el值）；
});
var productIDs=values.join（）；；
//在此处创建对$（this）的引用：
$this=$（this）；
$.post（'productSelections.php'{
键入：“updateSelections”，
productId:productId，
selectionType:“单个”
}，函数（数据）{
data=JSON.parse（数据）；
if（data.error）{
var ajaxError=（data.text）；
var errorAlert='更新产品选择时出错-'+ajaxError；
$this.closest（'td'）.addClass（“危险”）；
//显示AJAX错误详细信息
$（“#更新选择错误消息”）.html（错误警报）；
$（“#更新选择错误”）.show（）；
return；//不再执行此函数
}否则{
$this.closest（'td'）.addClass（“成功”）
$this.closest（'td'）。删除类（“危险”）；
}
}).失败（功能（xhr）{
var httpStatus=（xhr.status）；
var ajaxError='更新产品选择时出错-AJAX请求错误。HTTP状态：'+httpStatus+'。请与Apple Business Operations'联系；
$this.closest（'td'）.addClass（“危险”）；
$（“#updateSelectorMessage”）.html（ajaxError）；
$（“#更新选择错误”）.show（）；
$this.attr（'checked'，false）；//取消选中它
});
});
});

产品ID
描述
电话36288
苹果
电话36289
香蕉
36290
橘子
电话36292
葡萄
您可以使用顶部复选框的状态来确定是否应选中或取消选中全部。像这样


$（文档）.ready（函数（）{
$（'.select all'）。在（'click'，function（）上{
var shouldCheck=$（this）.is（“：checked”）；
$（'table>t正文输入[type=“checkbox”]”）。每个（函数（i，el）{
$（el）.prop（'checked'，shouldCheck）；
});
});
});

产品ID
描述
电话36288
苹果
电话36289
香蕉
36290
橘子
电话36292
葡萄
检查此代码，我认为它符合您的要求。
如果选中所有子复选框，如果取消选中任何子复选框，则取消选中其所有复选框


$（'.select all'）。在（'click'，函数（）{
如果（$（this）.is（“：checked”））{
$（'.select item'）.prop（'checked'，this.checked）；
}否则{
$（“.select item”）.removeAttr（'checked'）；
$（“.select all”）.removeAttr（'checked'）；
}
});
$（'.select item'）。在（'click'，函数（）{
如果（$（'.select item:checked'）。长度===$（'.select item'）。长度）{
$（“.select all”）.prop（'checked'，true）；