[英]how to solve on/off switch javascript
我的on / off开关有问题。我有一个代码无法正常工作,因为当我以表格形式编写check时它可以工作,但是我想拖拉心情,on and off,当不写检查时它的形式不起作用,当我在两者中都签入时,它不起作用,当我在其中之一中签入时,它起作用但不正确。:(
<script>
function DisEn(X){
document.A.T1.disabled=X;
document.A.T2.disabled=X;
}
</script>
</head>
<form name="A" method="get" action="switch.php">
<div class="onoffswitch">
<input type="checkbox" name="onoffswitch" value="off" class="onoffswitch-checkbox"
id="myonoffswitch" onClick="DisEn(false)" checked>
<input type="checkbox" name="onoffswitch" value="on" class="onoffswitch-checkbox"
id="myonoffswitch1" onClick="DisEn(false)" >
<label class="onoffswitch-label" for="myonoffswitch">
<div class="onoffswitch-inner"></div>
<div class="onoffswitch-switch"></div>
</label>
</div>
<input type="text" name="T1" value="A" disabled>
<input type="text" name="T2" value="B" disabled>
<input type="submit" name="T4" value="Submit" >
</form>
使用onchange = DisEn(this)
例如以下示例:
<script>
function DisEn(element){
if (element.checked === true) {
document.A.T1.disabled=true;
document.A.T2.disabled=true;
element.value="off";
} else {
document.A.T1.disabled=false;
document.A.T2.disabled=false;
element.value="on";
}
}
</script>
<form name="A" method="get" action="switch.php">
<div class="onoffswitch">
<input type="checkbox" name="onoffswitch" value="off"
class="onoffswitchcheckbox" id="myonoffswitch"
onchange="DisEn(this)" checked = "checked" />
<label class="onoffswitch-label" for="myonoffswitch">
<div class="onoffswitch-inner"></div>
<div class="onoffswitch-switch"></div>
</label>
</div>
<input type="text" name="T1" value="A" disabled = "disabled" />
<input type="text" name="T2" value="B" disabled = "disabled" />
<input type="submit" name="T4" value="Submit" />
</form>
您可以在此处查看演示 。 如果出现问题或忘记做某事,请通知我,然后更新演示。
使用此功能,您只需在复选框上使用onchange = DisEn(this)
以为每个复选框进行设置。
HTML:
<form name="A" method="get" action="switch.php">
<div class="onoffswitch">
<input type="checkbox" name="onoffswitch" value="off"class="onoffswitchcheckbox"
id="myonoffswitch" onClick="DisEn()" checked>
<label class="onoffswitch-label" for="myonoffswitch">
<div class="onoffswitch-inner"></div>
<div class="onoffswitch-switch"></div>
</label>
</div>
<input type="text" name="T1" value="A" disabled>
<input type="text" name="T2" value="B" disabled>
<input type="submit" name="T4" value="Submit" >
</form>
Javascript:
function DisEn(){
if(document.A.onoffswitch.checked == false)
{
document.A.T1.disabled=false;
document.A.T2.disabled=false;
}
else
{
document.A.T1.disabled=true;
document.A.T2.disabled=true;
}
}
这是jsfiddle >> http://jsfiddle.net/YgWku/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.