通过另一个输入更改输入

rm5edbpk  于 2021-09-13  发布在  Java
关注(0)|答案(0)|浏览(186)
<!--***********************************************************************************************************************************-->
        <!-- ZONA DE SCRIPTS --><!-- ZONA DE SCRIPTS --><!-- ZONA DE SCRIPTS --><!-- ZONA DE SCRIPTS --><!-- ZONA DE SCRIPTS -->
<!--***********************************************************************************************************************************-->

<!-- RELOGIO DIGITAL -->

<script>

      function relogio(){
        var data=new Date();
        var hor=data.getHours();
        var min=data.getMinutes();
        var seg=data.getSeconds();

        if(hor < 10){
          hor="0"+hor;
        }
        if(min < 10){
          min="0"+min;
        }
        if(seg < 10){
          seg="0"+seg;
        }

        var horas=hor + ":" + min + ":" + seg;

        document.getElementById("rel").value=horas;
      }

      var timer=setInterval(relogio,1000);

    </script>

<script language="JavaScript" type="text/javascript">

function insereInput() {
  if ( document.getElementById('btn').innerHTML == 'Disponivel' ) {

    document.getElementById('btn').innerHTML = '<marquee>Em Serviço</marquee>';

    document.getElementById('inputprogram').innerHTML = '<marquee>Em Serviço</marquee>';
  } else {

    document.getElementById('btn').innerHTML = 'Disponivel';
    document.getElementById('btn').innerHTML = 'Disponivel';
  }
}

</script>
<script language="JavaScript" type="text/javascript">

function insereInput2() {
  if ( document.getElementById('btn2').innerHTML == 'Disponivel' ) {

    document.getElementById('btn2').innerHTML = '<marquee>Em Serviço</marquee>';

    document.getElementById('inputprogram2').innerHTML = '<marquee>Em Serviço</marquee>';
  } else {

    document.getElementById('btn2').innerHTML = 'Disponivel';
    document.getElementById('btn2').innerHTML = 'Disponivel';
  }
}

</script>

<script language="JavaScript" type="text/javascript">

function insereInput3() {
  if ( document.getElementById('btn3').innerHTML == 'Disponivel' ) {

    document.getElementById('btn3').innerHTML = '<marquee>Em Serviço</marquee>';

    document.getElementById('inputprogram3').innerHTML = '<marquee>Em Serviço</marquee>';
  } else {

    document.getElementById('btn3').innerHTML = 'Disponivel';
    document.getElementById('btn3').innerHTML = 'Disponivel';
  }
}

</script>

<script language="JavaScript" type="text/javascript">

function insereInput4() {
  if ( document.getElementById('btn4').innerHTML == 'Disponivel' ) {

    document.getElementById('btn4').innerHTML = '<marquee>Em Serviço</marquee>';

    document.getElementById('inputprogram4').innerHTML = '<marquee>Em Serviço</marquee>';
  } else {

    document.getElementById('btn4').innerHTML = 'Disponivel';
    document.getElementById('btn4').innerHTML = 'Disponivel';
  }
}

</script>

<script language="JavaScript" type="text/javascript">

function insereInput5() {
  if ( document.getElementById('btn5').innerHTML == 'Disponivel' ) {

    document.getElementById('btn5').innerHTML = '<marquee>Em Serviço</marquee>';

    document.getElementById('inputprogram5').innerHTML = '<marquee>Em Serviço</marquee>';
  } else {

    document.getElementById('btn5').innerHTML = 'Disponivel';
    document.getElementById('btn5').innerHTML = 'Disponivel';
  }
}

</script>

<script language="JavaScript" type="text/javascript">

function insereInput6() {
  if ( document.getElementById('btn6').innerHTML == 'Disponivel' ) {

    document.getElementById('btn6').innerHTML = '<marquee>Em Serviço</marquee>';

    document.getElementById('inputprogram6').innerHTML = '<marquee>Em Serviço</marquee>';
  } else {

    document.getElementById('btn6').innerHTML = 'Disponivel';
    document.getElementById('btn6').innerHTML = 'Disponivel';
  }
}

</script>

<script language="JavaScript" type="text/javascript">

function insereInput7() {
  if ( document.getElementById('btn7').innerHTML == 'Disponivel' ) {

    document.getElementById('btn7').innerHTML = '<marquee>Em Serviço</marquee>';

    document.getElementById('inputprogram7').innerHTML = '<marquee>Em Serviço</marquee>';
  } else {

    document.getElementById('btn7').innerHTML = 'Disponivel';
    document.getElementById('btn7').innerHTML = 'Disponivel';
  }
}

</script>

<script language="JavaScript" type="text/javascript">

function insereInput8() {
  if ( document.getElementById('btn8').innerHTML == 'Disponivel' ) {

    document.getElementById('btn8').innerHTML = '<marquee>Em Serviço</marquee>';

    document.getElementById('inputprogram8').innerHTML = '<marquee>Em Serviço</marquee>';
  } else {

    document.getElementById('btn8').innerHTML = 'Disponivel';
    document.getElementById('btn8').innerHTML = 'Disponivel';
  }
}

</script>

<script language="JavaScript" type="text/javascript">

function insereInput9() {
  if ( document.getElementById('btn9').innerHTML == 'Disponivel' ) {

    document.getElementById('btn9').innerHTML = '<marquee>Em Serviço</marquee>';

    document.getElementById('inputprogram2').innerHTML = '<marquee>Em Serviço</marquee>';
  } else {

    document.getElementById('btn9').innerHTML = 'Disponivel';
    document.getElementById('btn9').innerHTML = 'Disponivel';
  }
}

</script>

<script language="JavaScript" type="text/javascript">

function insereInput10() {
  if ( document.getElementById('btn10').innerHTML == 'Disponivel' ) {

    document.getElementById('btn10').innerHTML = '<marquee>Em Serviço</marquee>';

    document.getElementById('inputprogram2').innerHTML = '<marquee>Em Serviço</marquee>';
  } else {

    document.getElementById('btn10').innerHTML = 'Disponivel';
    document.getElementById('btn10').innerHTML = 'Disponivel';
  }
}

</script>
<script language="JavaScript" type="text/javascript">

function insereInput11() {
  if ( document.getElementById('btn11').innerHTML == 'Disponivel' ) {

    document.getElementById('btn11').innerHTML = '<marquee>Em Serviço</marquee>';

    document.getElementById('inputprogram11').innerHTML = '<marquee>Em Serviço</marquee>';
  } else {

    document.getElementById('btn11').innerHTML = 'Disponivel';
    document.getElementById('btn11').innerHTML = 'Disponivel';
  }
}

</script>

<script language="JavaScript" type="text/javascript">

function insereInput12() {
  if ( document.getElementById('btn12').innerHTML == 'Disponivel' ) {

    document.getElementById('btn12').innerHTML = '<marquee>Em Serviço</marquee>';

    document.getElementById('inputprogram12').innerHTML = '<marquee>Em Serviço</marquee>';
  } else {

    document.getElementById('btn12').innerHTML = 'Disponivel';
    document.getElementById('btn12').innerHTML = 'Disponivel';
  }
}

</script>
<script>

    var atual_state = 'DESLIGADA';

    function mudaEstado() {
        atual_state === 'DESLIGADA' ? atual_state = 'LIGADA' : atual_state = 'DESLIGADA';
        return atual_state;
    }

    function ligaDesliga() {

        if (atual_state === 'DESLIGADA')
            document.getElementById('lampada').src = 'style/wave2.gif';
        else
            document.getElementById('lampada').src = 'style/wave2dark.gif';

        mudaEstado();

    }
</script>

<script>

    var atual_state = 'DESLIGADA2';

    function mudaEstado2() {
        atual_state === 'DESLIGADA2' ? atual_state = 'LIGADA2' : atual_state = 'DESLIGADA2';
        return atual_state;
    }

    function ligaDesliga2() {

        if (atual_state === 'DESLIGADA2')
            document.getElementById('lampada2').src = 'style/wave2.gif';
        else
            document.getElementById('lampada2').src = 'style/wave2dark.gif';

        mudaEstado2();

    }
</script>

<script>

    var atual_state = 'DESLIGADA3';

    function mudaEstado3() {
        atual_state === 'DESLIGADA3' ? atual_state = 'LIGADA3' : atual_state = 'DESLIGADA3';
        return atual_state;
    }

    function ligaDesliga3() {

        if (atual_state === 'DESLIGADA3')
            document.getElementById('lampada3').src = 'style/wave2.gif';
        else
            document.getElementById('lampada3').src = 'style/wave2dark.gif';

        mudaEstado3();

    }
</script>

<script>

    var atual_state = 'DESLIGADA4';

    function mudaEstado4() {
        atual_state === 'DESLIGADA4' ? atual_state = 'LIGADA4' : atual_state = 'DESLIGADA4';
        return atual_state;
    }

    function ligaDesliga4() {

        if (atual_state === 'DESLIGADA4')
            document.getElementById('lampada4').src = 'style/wave2.gif';
        else
            document.getElementById('lampada4').src = 'style/wave2dark.gif';

        mudaEstado4();

    }
</script>

<script>

    var atual_state = 'DESLIGADA5';

    function mudaEstado5() {
        atual_state === 'DESLIGADA5' ? atual_state = 'LIGADA5' : atual_state = 'DESLIGADA5';
        return atual_state;
    }

    function ligaDesliga5() {

        if (atual_state === 'DESLIGADA5')
            document.getElementById('lampada5').src = 'style/wave2.gif';
        else
            document.getElementById('lampada5').src = 'style/wave2dark.gif';

        mudaEstado5();

    }
</script>

<script>

    var atual_state = 'DESLIGADA6';

    function mudaEstado6() {
        atual_state === 'DESLIGADA6' ? atual_state = 'LIGADA6' : atual_state = 'DESLIGADA6';
        return atual_state;
    }

    function ligaDesliga6() {

        if (atual_state === 'DESLIGADA6')
            document.getElementById('lampada6').src = 'style/wave2.gif';
        else
            document.getElementById('lampada6').src = 'style/wave2dark.gif';

        mudaEstado6();

    }
</script>

<script>

    var atual_state = 'DESLIGADA7';

    function mudaEstado7() {
        atual_state === 'DESLIGADA7' ? atual_state = 'LIGADA7' : atual_state = 'DESLIGADA7';
        return atual_state;
    }

    function ligaDesliga7() {

        if (atual_state === 'DESLIGADA7')
            document.getElementById('lampada7').src = 'style/wave2.gif';
        else
            document.getElementById('lampada7').src = 'style/wave2dark.gif';

        mudaEstado7();

    }
</script>

<script>

    var atual_state = 'DESLIGADA8';

    function mudaEstado8() {
        atual_state === 'DESLIGADA8' ? atual_state = 'LIGADA8' : atual_state = 'DESLIGADA8';
        return atual_state;
    }

    function ligaDesliga8() {

        if (atual_state === 'DESLIGADA8')
            document.getElementById('lampada8').src = 'style/wave2.gif';
        else
            document.getElementById('lampada8').src = 'style/wave2dark.gif';

        mudaEstado8();

    }
</script>

<script>

    var atual_state = 'DESLIGADA9';

    function mudaEstado9() {
        atual_state === 'DESLIGADA9' ? atual_state = 'LIGADA9' : atual_state = 'DESLIGADA9';
        return atual_state;
    }

    function ligaDesliga9() {

        if (atual_state === 'DESLIGADA9')
            document.getElementById('lampada9').src = 'style/wave2.gif';
        else
            document.getElementById('lampada9').src = 'style/wave2dark.gif';

        mudaEstado9();

    }
</script>

<script>

    var atual_state = 'DESLIGADA10';

    function mudaEstado10() {
        atual_state === 'DESLIGADA10' ? atual_state = 'LIGADA10' : atual_state = 'DESLIGADA10';
        return atual_state;
    }

    function ligaDesliga10() {

        if (atual_state === 'DESLIGADA10')
            document.getElementById('lampada10').src = 'style/wave2.gif';
        else
            document.getElementById('lampada10').src = 'style/wave2dark.gif';

        mudaEstado10();

    }
</script>

<script>

    var atual_state = 'DESLIGADA11';

    function mudaEstado11() {
        atual_state === 'DESLIGADA11' ? atual_state = 'LIGADA11' : atual_state = 'DESLIGADA11';
        return atual_state;
    }

    function ligaDesliga11() {

        if (atual_state === 'DESLIGADA11')
            document.getElementById('lampada11').src = 'style/wave2.gif';
        else
            document.getElementById('lampada11').src = 'style/wave2dark.gif';

        mudaEstado11();

    }
</script>

<script>

    var atual_state = 'DESLIGADA12';

    function mudaEstado12() {
        atual_state === 'DESLIGADA12' ? atual_state = 'LIGADA12' : atual_state = 'DESLIGADA12';
        return atual_state;
    }

    function ligaDesliga12() {

        if (atual_state === 'DESLIGADA12')
            document.getElementById('lampada12').src = 'style/wave2.gif';
        else
            document.getElementById('lampada12').src = 'style/wave2dark.gif';

        mudaEstado12();

    }
</script>
/*Formatação geral da página*/
html, body, #home {
  height: 100%
}

/*Formatação do Fundo da Página*/

body {
  background-color: grey;

 background-size: cover;
  background-attachment: fixed;
  font-family: Helvetica, Arial, sans-serif;
}

/*Formatação do Logotipo*/

# logo{

    position: relative;
    width:150px;
   top: -130px;
   margin-left: 50px;

}

/*Formatação do Cabeçalho 1*/

# bvsah1{

    font-family:fantasy;
    color: red;
    font-size: 40px;
    text-align: right;
    margin-right: 30px;

}

/*Formatação do Cabeçalho 2*/

# bvsah2{

  font-family:fantasy;
    color: darkred;
    font-size: 25px;
    text-align: right;
    margin-right: 30px;
    margin-top: -40px;

}

/*Formatação do Relógio*/

@font-face {
    font-family: Digital;
    src: url(../style/digital-7.ttf)
}

# rel{

    position: relative;
   font-family: 'Digital';
    background-color: black;
    color: lightgreen;
    font-size: 25px;
    font-weight: bold;
    width: 150px;
    text-align: center;
    margin-left: 1310px;
    margin-top: -20px;
    padding: 10px;

}

# data{

    font-family: 'Digital';
    background-color: black;
    color: lightgreen;
    font-size: 25px;
    font-weight: bold;
    width: 300px;
    text-align: center;
padding: 11px;
margin-top:-48px;
float: right;
margin-right: 200px;

}

/*Formatação da linha separadora */

hr{

    border-top: 3px solid black;
    margin-top: -120px;
    margin-bottom: 20px;
}

/*Formatação da caixa de borda e texto legenda */

.bordageral{

 border: 4px groove white !important;
  -webkit-box-shadow: 0px 0px 0px 0px #000;
  box-shadow: 0px 0px 0px 0px #000;
    background-color: #635655;

}

/*Formatação da caixa de borda e texto legenda */

.bordalegenda{

  font-size: 1.8em !important;
  text-align: left !important;
  width: auto;
  padding: 0 10px;
  padding-left: 30px;
  border-bottom: none;
  color: white;
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: -10px;
  font-weight: bold;
  background-color: transparent;
}

.choices {
      background-color: blue;
      display: inline-block;
      cursor: pointer;
      height: 150px;
      width: 250px;
      margin-left: 30px;
      position: relative;
      color: white;
      font-weight: bold;
      font-size: 25px;
      text-align: center;

    }

    input{
      display: none
    }
    input:checked+label>.choices {
      background-color: red !important;

    }

.choices2 {
      background-color: black;
      cursor: pointer;
      height: 90px;
      width: 250px;
    z-index:1;
    margin-top: -110px;
    margin-left: 30px;
    position: absolute;

}

.choices3 {
      background-color: white;
      cursor: pointer;

      height: 20px;
      width: 250px;
    z-index:1;
    margin-top: -20px;
    margin-left: 30px;
    position: absolute;

}

# lampada

{

margin-left: 50px;
position: relative;
width: 150px;

}

# lampada2

{

margin-left: 50px;
position: relative;
width: 150px;

}

# lampada3

{

margin-left: 50px;
position: relative;
width: 150px;

}

# lampada4

{

margin-left: 50px;
position: relative;
width: 150px;

}

# lampada5

{

margin-left: 50px;
position: relative;
width: 150px;

}

# lampada6

{

margin-left: 50px;
position: relative;
width: 150px;

}

# lampada7

{

margin-left: 50px;
position: relative;
width: 150px;

}

# lampada8

{

margin-left: 50px;
position: relative;
width: 150px;

}

# lampada9

{

margin-left: 50px;
position: relative;
width: 150px;

}

# lampada10

{

margin-left: 50px;
position: relative;
width: 150px;

}

# lampada11

{

margin-left: 50px;
position: relative;
width: 150px;

}

# lampada12

{

margin-left: 50px;
position: relative;
width: 150px;

}
<!DOCTYPE html>
<html>
<head>

<!--***********************************************************************************************************************************-->
    <!--DEFINIÇOES DE PÁG. --><!--DEFINIÇOES DE PÁG. --><!--DEFINIÇOES DE PÁG. --><!--DEFINIÇOES DE PÁG. --><!--DEFINIÇOES DE PÁG. -->
<!--***********************************************************************************************************************************-->

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Consola de Gestão de Veículos</title>
     <link rel="icon" href="style/logo2.png">
    <script src="playlist.js" defer></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="style/style.css">
<link href='https://fonts.googleapis.com/css?family=Orbitron' rel='stylesheet' type='text/css'>

</head>

<body><!-- Inicio Body -->

<!--***********************************************************************************************************************************-->
        <!-- CORPO DA PÁGINA --><!-- CORPO DA PÁGINA --><!-- CORPO DA PÁGINA --><!-- CORPO DA PÁGINA --><!-- CORPO DA PÁGINA -->
<!--***********************************************************************************************************************************-->

<!--***********************************************************************************************************************************-->
                                        <!-- CONSTRUÇÃO DA TABELA DE OCORRÊNCIAS -->
<!--***********************************************************************************************************************************-->
<!-- Borda com texto OCORRRÊNCIAS-->
<fieldset class="bordageral">
  <legend class="bordalegenda">Gestão de Veículos</legend>
<br>

<!-- Inicio tabela -->
<table id="tblsounds">

<td>
<div class="btn-wrap">
<input type="checkbox" id="veiculos1"  /><label for="veiculos1"><div class="choices">VCOT-01</div></label>
<input type="checkbox" id="imagem1"  onclick="ligaDesliga()"/><label for="imagem1"><div class="choices2"><img id="lampada"  src="style/wave2dark.gif"></div></label>
<input type="checkbox" id="filtro"  /><label for="filtro1"><div class="choices3"><span id="btn" onclick="insereInput()">Disponivel</span></div></label>
</div>

</td>
<td>
<div class="btn-wrap">
<input type="checkbox" id="veiculos2"  /><label for="veiculos2"><div class="choices">VTPT-01</div></label>
<input type="checkbox" id="imagem2"   onclick="ligaDesliga2()"  /><label for="imagem2"><div class="choices2"><img id="lampada2"  src="style/wave2dark.gif"></div></label>
<input type="checkbox" id="filtro"  /><label for="filtro1"><div class="choices3"><span id="btn2" onclick="insereInput2()">Disponivel</span></div></label>

</div>
</td>
<td>
<div class="btn-wrap">
<input type="checkbox" id="veiculos3"  /><label for="veiculos3"><div class="choices">VFCI-01</div></label>
<input type="checkbox" id="imagem3"  onclick="ligaDesliga3()" /><label for="imagem3"><div class="choices2"><img id="lampada3"  src="style/wave2dark.gif"  style="width:150px" src="style/wave2dark.gif"></div></label>
<input type="checkbox" id="filtro"  /><label for="filtro1"><div class="choices3"><span id="btn3" onclick="insereInput3()">Disponivel</span></div></label>

</div>
</td>
<td>
<div class="btn-wrap">
<input type="checkbox" id="veiculos4"  /><label for="veiculos4"><div class="choices">VFCI-02</div></label>
<input type="checkbox" id="imagem4"  onclick="ligaDesliga4()" /><label for="imagem4"><div class="choices2"><img id="lampada4"  src="style/wave2dark.gif"></div></label>
<input type="checkbox" id="filtro"  /><label for="filtro1"><div class="choices3"><span id="btn4" onclick="insereInput4()">Disponivel</span></div></label>

</div>
</td>
<td>
<div class="btn-wrap">
<input type="checkbox" id="veiculos5"  /><label for="veiculos5"><div class="choices">VALE-02</div></label>
<input type="checkbox" id="imagem5"  onclick="ligaDesliga5()" /><label for="imagem5"><div class="choices2"><img id="lampada5"  src="style/wave2dark.gif"></div></label>
<input type="checkbox" id="filtro"  /><label for="filtro1"><div class="choices3"><span id="btn5" onclick="insereInput5()">Disponivel</span></div></label>

</div>
</td>
</table>

<!-- Inicio tabela -->
<table id="tblsounds">

<td>
<div class="btn-wrap">
<input type="checkbox" id="veiculos6"  /><label for="veiculos6"><div class="choices">VALE-03</div></label>
<input type="checkbox" id="imagem6"  onclick="ligaDesliga6()" /><label for="imagem6"><div class="choices2"><img id="lampada6"  src="style/wave2dark.gif"></div></label>
<input type="checkbox" id="filtro"  /><label for="filtro1"><div class="choices3"><span id="btn6" onclick="insereInput6()">Disponivel</span></div></label>

</div>
</td>
<td>
<div class="btn-wrap">
<input type="checkbox" id="veiculos7"  /><label for="veiculos7"><div class="choices">VLCI-01</div></label>
<input type="checkbox" id="imagem7" onclick="ligaDesliga7()"  /><label for="imagem7"><div class="choices2"><img id="lampada7"  src="style/wave2dark.gif"></div></label>
<input type="checkbox" id="filtro"  /><label for="filtro1"><div class="choices3"><span id="btn7" onclick="insereInput7()">Disponivel</span></div></label>

</div>
</td>
<td>
<div class="btn-wrap">
<input type="checkbox" id="veiculos8"  /><label for="veiculos8"><div class="choices">VTTU-01</div></label>
<input type="checkbox" id="imagem8"  onclick="ligaDesliga8()" /><label for="imagem8"><div class="choices2"><img id="lampada8"  src="style/wave2dark.gif"></div></label>
<input type="checkbox" id="filtro"  /><label for="filtro1"><div class="choices3"><span id="btn8" onclick="insereInput8()">Disponivel</span></div></label>

</div></td>
<td>
<div class="btn-wrap">
<input type="checkbox" id="veiculos9"  /><label for="veiculos9"><div class="choices">VSAT-01</div></label>
<input type="checkbox" id="imagem9"  onclick="ligaDesliga9()" /><label for="imagem9"><div class="choices2"><img id="lampada9"  src="style/wave2dark.gif"></div></label>
<input type="checkbox" id="filtro"  /><label for="filtro1"><div class="choices3"><span id="btn9" onclick="insereInput9()">Disponivel</span></div></label>

</div></td>
<td>
<div class="btn-wrap">
<input type="checkbox" id="veiculos10"  /><label for="veiculos10"><div class="choices">ABSC-02</div></label>
<input type="checkbox" id="imagem10"  onclick="ligaDesliga10()" /><label for="imagem10"><div class="choices2"><img id="lampada10"  src="style/wave2dark.gif"></div></label>
<input type="checkbox" id="filtro"  /><label for="filtro1"><div class="choices3"><span id="btn10" onclick="insereInput10()">Disponivel</span></div></label>

</div></td>
<td>
</table>

<!-- Inicio tabela -->
<table id="tblsounds">

<td>
<div class="btn-wrap">
<input type="checkbox" id="veiculos11"  /><label for="veiculos11"><div class="choices">ABSC-03</div></label>
<input type="checkbox" id="imagem11"  onclick="ligaDesliga11()" /><label for="imagem11"><div class="choices2"><img id="lampada11"  src="style/wave2dark.gif"></div></label>
<input type="checkbox" id="filtro"  /><label for="filtro1"><div class="choices3"><span id="btn11" onclick="insereInput11()">Disponivel</span></div></label>

</div>
</td>
<td>
<div class="btn-wrap">
<input type="checkbox" id="veiculos12"  /><label for="veiculos12"><div class="choices">ABSC-09</div></label>
<input type="checkbox" id="imagem12"  onclick="ligaDesliga12()" /><label for="imagem12"><div class="choices2"><img id="lampada12"  src="style/wave2dark.gif"></div></label>
<input type="checkbox" id="filtro" /><label for="filtro1"><div class="choices3"><span id="btn12" onclick="insereInput12()">Disponivel</span></div></div></label>

</div>
</td>

<td>
</table>

</fieldset><!-- Fim Borda com texto OCORRRÊNCIAS-->

<!-- Fim tabela -->
</td>
</table>

</body><!-- Fim Body -->
</html>

这里我有我的代码,它几乎可以完美地满足我的需求。单击蓝色带,它将变为红色。安静的。我想知道的是,当我更改背景颜色时,单击可以将白色带文本更改为不可用,然后再次单击时,红色带变回蓝色,白色带文本变为可用。

<input type="checkbox" id="veiculos1"  /><label for="veiculos1"><div class="choices">VCOT-01</div></label>
    input{
      display: none
    }
    input:checked+label>.choices {
      background-color: red !important;

    }

在这里,我可以通过单击红色来更改背景色。我想要的是,当单击时,除了将蓝色传递给红色之外,还将更改以下输入的文本

<input type="checkbox" id="filtro"  /><label for="filtro1"><div class="choices3"><span id="btn" onclick="insereInput()">Disponivel</span>

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题