更改类以选中复选框JavaScript
Changing class to check a check box JavaScript
本文关键字:复选框 JavaScript 更新时间:2023-09-26
我有一个模态表单,它在页面加载时由数据库中的数据填充。
数据在模态中被正确地传递和填充——但是,当选中复选框时,它不会显示选中的动画,看起来是未选中的。
我知道它是被选中的,尽管在第一次点击复选框时,它似乎什么都没做,而且看起来仍然没有被选中,然后在第二次点击时,它会选中复选框。
在点击复选框之前和之后检查页面时,我注意到icheckbox_minimal
&aria-checked="false"
也需要更改,以使选中的gfx看起来是选中的。如何使用JavaScript更改这些内容?
<span type="checkbox" class="" name="cbxScheduleEditTue"><div class="icheckbox_minimal" aria-checked="false" aria-disabled="false" style="position: relative;"><input id="ContentPlaceHolder2_cbxScheduleEditTue" type="checkbox" name="ctl00$ContentPlaceHolder2$cbxScheduleEditTue" style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"><ins class="iCheck-helper" style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"></ins></div></span>
知道我正在使用以下内容可能会有所帮助:
<script src="js/bootstrap.min.js"></script>
<script src="js/icheck.js"></script>
我的javascript:
<!-- Function - modalEditSchedule -->
<script type="text/javascript">
function modalEditSchedule(ScheduleRatesID, tempStartDate, tempEndDate, start, endtime, mon, tue, wed, thu, fri, sat, sun, CarersReq) {
document.getElementById('<%=sidInput.ClientID%>').value = ScheduleRatesID;
document.getElementById('<%=txtScheduleEditStartDate.ClientID%>').value = tempStartDate;
document.getElementById('<%=txtScheduleEditEndDate.ClientID%>').value = tempEndDate;
document.getElementById('<%=txtScheduleEditStartTime.ClientID%>').value = start;
document.getElementById('<%=txtScheduleEditEndTime.ClientID%>').value = endtime;
if (mon == 'Yes') {
document.getElementById('<%=cbxScheduleEditMon.ClientID%>').checked = true;
}
if (tue == 'Yes') {
document.getElementById('<%=cbxScheduleEditTue.ClientID%>').checked = true;
}
if (wed == 'Yes') {
document.getElementById('<%=cbxScheduleEditWed.ClientID%>').checked = true;
}
if (thu == 'Yes') {
document.getElementById('<%=cbxScheduleEditThu.ClientID%>').checked = true;
}
if (fri == 'Yes') {
document.getElementById('<%=cbxScheduleEditFri.ClientID%>').checked = true;
}
if (sat == 'Yes') {
document.getElementById('<%=cbxScheduleEditSat.ClientID%>').checked = true;
}
if (sun == 'Yes') {
document.getElementById('<%=cbxScheduleEditSun.ClientID%>').checked = true;
}
document.getElementById('<%=ddlScheduleEditCarersReq.ClientID%>').value = CarersReq;
};
</script>
Icheck实用程序(js/Icheck.js)正在对您的复选框进行hijaking和包装,这就是为什么您的方法被Icheck行为覆盖的原因。了解它。
// try replacing this calls:
document.getElementById('<%=cbxScheduleEditSun.ClientID%>').checked = true;
// by this ones (dont forget to add the '#' at the beggining):
$('#<%=cbxScheduleEditSun.ClientID%>').iCheck('check');
或者,作为补充,您可以使用纯jQuery,阅读这个答案。
您可以使用setAttribute
函数更改元素的任何属性。
document.getElementById('<%=cbxScheduleEditWed.ClientID%>').setAttribute('aria-checked', 'false');
相关文章:
- 为复选框javascript指定两个值
- Javascript复选框函数:;缺少:在属性id之后"
- JavaScript-切换“;全部检查”;复选框true/false
- 如何从javascript/jquery中的复选框中获取布尔值
- 如何使用javascript函数在gridview中按行启用/禁用复选框
- 使用javascript在页面加载时取消选中所有复选框
- 更改类以选中复选框JavaScript
- 选中所有复选框javascript
- 方法通过复选框javascript获取触发器
- 选中所有复选框 JavaScript
- 复选框 Javascript 函数在 Bootstrap modal 中不起作用
- 使用复选框 JavaScript 禁用按钮
- 隐藏输入未正确选择的自定义复选框.Javascript需要调整
- 不带POSTING值的求和复选框-Javascript
- 自定义警报与复选框- Javascript
- 按钮,根据字符串开始选择复选框- Javascript
- 简单的复选框javascript不起作用
- 禁用和启用复选框Javascript
- 如何计算表单中的所有复选框(Javascript)
- 数据类型检查提示复选框javascript