简体   繁体   English

如何解决开/关JavaScript

[英]how to solve on/off switch javascript

I have a problem in on/off switch.i have a code which it doesn't work correctly,because it works when i write checked in its form,but i want tow mood,on and off,when don't writ checked in its form it doesn't work and when i write checked in both,it doesn't work,when i write checked in one of them it works but not correctly.:( 我的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>

Use onchange = DisEn(this) like this example: 使用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>

You can check demo here . 您可以在此处查看演示 If it has something wrong or I forgot to do something, notify and I will update demo. 如果出现问题或忘记做某事,请通知我,然后更新演示。

Using this, you will be able to set it for every checkbox, just using onchange = DisEn(this) on your checkboxes. 使用此功能,您只需在复选框上使用onchange = DisEn(this)以为每个复选框进行设置。

HTML: 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: 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;
    }


}  

Here is the jsfiddle >> http://jsfiddle.net/YgWku/ jsfiddle >> http://jsfiddle.net/YgWku/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM