layui組件checkbox選中取消，無(wú)反應(yīng)，沒效果的原因

layui組件checkbox選中取消，無(wú)反應(yīng)，沒效果的原因？相信很多沒有經(jīng)驗(yàn)的人對(duì)此束手無(wú)策，為此本文總結(jié)了問題出現(xiàn)的原因和解決方法，通過這篇文章希望你能解決這個(gè)問題。

動(dòng)態(tài)的設(shè)置checkbox的選中取消狀態(tài)，選中狀態(tài)。

$("input[type='checkbox']").each(function(){
$(this).prop('checked', false);
});

這樣設(shè)置按理來(lái)說是會(huì)產(chǎn)生效果的，可是結(jié)果往往有點(diǎn)出人意料，點(diǎn)擊取消全選沒有任何的效果，也沒有報(bào)錯(cuò)。

后來(lái)查閱官方文檔后找到了原因

再每一次對(duì)layui 組件select,checkbox等操作后應(yīng)該再進(jìn)行渲染一遍。如下加入：form.render();

$("input[type='checkbox']").each(function(){
$(this).prop('checked', false);
});
layui.form.render();
//form.render("checkbox")
//兩種方式都可以

在打開頁(yè)面，操作成功。

問題二：如果根據(jù)后臺(tái)的數(shù)據(jù)想要?jiǎng)討B(tài)的給checkbox賦值，每次賦值過后，在請(qǐng)求一次，會(huì)在原來(lái)選中的checkbox中添加新的選中數(shù)據(jù)，也就是說每一次的操作都在疊加，并沒有取消請(qǐng)求之前選中的checkbox.

解決方法，在每一次重新請(qǐng)求之前都把checkbox選中的取消掉，請(qǐng)求成功過后重新匹配值再選中。

請(qǐng)求之前：

$("input[type='checkbox']").each(function(){
$(this).prop('checked', false);
});
layui.form.render();

請(qǐng)求之后：

for (var i = 0; i < resdata.length; i++) {
$("input[type='checkbox']").each(function(){
if($(this).val()== resdata[i].SensorID){
$(this).prop('checked', true);
}
})
}
layui.form.render();

請(qǐng)求之后重新選中

切記每次操作后都需要form.render();

看完上述內(nèi)容，你們掌握l(shuí)ayui組件checkbox選中取消，無(wú)反應(yīng)，沒效果的原因的方法了嗎？如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容，歡迎關(guān)注億速云行業(yè)資訊頻道，感謝各位的閱讀！