Jquery 带验证的切换按钮

我正在构建一个应用程序，需要通过web浏览器打开或关闭电源。我有一个切换按钮工作，但在“关闭”，我想一些验证。切换按钮是通过复选框方法创建的

我如何添加验证，如果用户单击“确定”，电源将关闭，但在“取消”时，复选框不应取消选中

函数myFunction（）{
var checkBox=document.getElementById（“myCheck”）；
var X=0；
如果（checkBox.checked==true）{
X=1；
警报（“开机”+X）；//仅用于测试
};
如果（checkBox.checked==false）{
//警报（“断电”）；
返回确认（“这将关闭电源
如果（$（X=1））
返回true；
//（'.myCheck'）.prop（'unchecked'））
//（“#开关输入”）.prop（'checked'，true）；
//$（checkBox.prop（'checked'，true）；
其他的
返回false；
};
}

/*平扳开关
==========================*/
.开关{
位置：相对位置；
显示：块；
垂直对齐：顶部；
宽度：100px；
高度：30px；
填充：3倍；
保证金：0；
背景：线性梯度（到底部，#eeeeee，#ffffff25px）；
背景图像：-webkit线性渐变（顶部，#eeeeee，#FFFFFF 25px）；
边界半径：18px；
盒影：插图0-1px白色，插图0 1px 1px rgba（0,0,0,0.05）；
光标：指针；
框大小：内容框；
}
.开关输入{
位置：绝对位置；
排名：0；
左：0；
不透明度：0；
框大小：内容框；
}
.开关标签{
位置：相对位置；
显示：块；
身高：继承；
字体大小：10px；
文本转换：大写；
背景:#eceef；
边界半径：继承；
盒影：插入0 1px2pRGBA（0,0,0,0.12），插入0 0 2pRGBA（0,0,0,0.15）；
框大小：内容框；
}
.开关标签：之前，
.开关标签：后{
位置：绝对位置；
最高：50%；
边缘顶部：-.5em；
线高：1；
-webkit转换：继承；
-moz转换：继承；
-o-过渡：继承；
过渡：继承；
框大小：内容框；
}
.开关标签：之前{
内容：attr（数据关闭）；
右：11px；
颜色：#AAAAA；
文本阴影：0 1px rgba（255、255、255、0.5）；
}
.开关标签：后{
内容：attr（有关的数据）；
左：11px；
颜色：#FFFFFF；
文本阴影：0 1pxRGBA（0,0,0,0.2）；
不透明度：0；
}
.开关输入：选中~.开关标签{
背景：#E1B42B；
盒影：插入0 1px2pRGBA（0,0,0,0.15），插入0 0 3pRGBA（0,0,0,0.2）；
}
.开关输入：选中~.开关标签：前{
不透明度：0；
}
.开关输入：选中~.开关标签：后{
不透明度：1；
}
.开关手柄{
位置：绝对位置；
顶部：4px；
左：4px；
宽度：28px；
高度：28px；
背景：线性梯度（至底部，#FFFFFF 40%，#F0）；
背景图像：-webkit线性渐变（顶部，#FFFFFF 40%，#F0）；
边界半径：100%；
盒影：1px1p5pRGBA（0,0,0,0.2）；
}
.开关手柄：前{
内容：“；
位置：绝对位置；
最高：50%；
左：50%；
裕度：-6px0-6px；
宽度：12px；
高度：12px；
背景：线性梯度（到底部，#eeeeee，#FFFFFF）；
背景图像：-webkit线性渐变（顶部，#eeeeee，#FFFFFF）；
边界半径：6px；
框阴影：插入0 1px rgba（0,0,0,0.02）；
}
.开关输入：选中~.开关手柄{
左：74px；
盒影：-1px1p5pRGBA（0,0,0,0.2）；
}
/*平开关
==========================*/
.调平开关{
填充：0；
背景：#FFF；
背景图像：无；
}
.平开关.开关标签{
背景：#FFF；
边框：实心2px#eceef；
盒影：无；
}
.平开开关。开关标签：后{
颜色：#0088cc；
}
.开关打开.开关手柄{
顶部：6px；
左：6px；
背景：#达达达；
宽度：22px；
高度：22px；
盒影：无；
}
.平开开关。开关手柄：前{
背景:#eceef；
}
.开关平坦。开关输入：选中~开关标签{
背景：#FFF；
边框颜色：#0088cc；
}
.开关平坦。开关输入：已检查~。开关手柄{
左：72px；
背景#0088cc；
盒影：无；
}
/*过渡
============================================================ */
.开关标签，
.开关手柄{
过渡：所有0.3秒缓解；
-webkit过渡：所有0.3秒轻松；
-moz转换：所有0.3秒轻松；
-o-过渡：所有0.3秒的速度；
}

我的切换演示
切换按钮示例

问题是因为当事件处理程序运行时，复选框已被取消选中，因此当您

返回false

时为时已晚。要解决此问题，您只需检查

确认（）

的结果是什么，如果用户取消了操作，只需将复选框设置回

已选中的状态即可

还有几件事需要注意。首先，处理
X
变量没有什么意义。我已经从答案中删除了该逻辑，因为它与问题无关。其次，您应该避免在*

事件属性上使用

。改为使用不引人注目的事件处理程序


document.getElementById（“myCheck”）.addEventListener（'change'，函数（e）{
如果（选中此项）{
控制台日志（“开机”）；
}否则{
如果（！确认（“这将关闭电源！您确定吗？”）{
this.checked=true；
}
};
})；
开关{
位置：相对位置；
显示：块；
垂直对齐：顶部；
宽度：100px；
高度：30px；
填充：3倍；
保证金：0；
背景：线性梯度（到底部，#eeeeee，#ffffff25px）；
背景图像：-webkit线性渐变（顶部，#eeeeee，#FFFFFF 25px）；
边界半径：18px；
盒影：插图0-1px白色，插图0 1px 1px rgba（0,0,0,0.05）；
光标：指针；
框大小：内容框；
}
.开关输入{
位置：绝对位置；
排名：0；
左：0；
不透明度：0；
框大小：内容框；
}
.开关标签{
位置：相对位置；
显示：块；
身高：继承；
字体大小：10px；
文本转换：大写；
背景:#eceef；
边界半径：继承；
长方体阴影：插入0 1px 2px rgba（0,0,0,0.12），插入0 0