1.jpg
[spoiler]
bandicam-2022-02-27-23-03-02-763.gif
2.jpg
7.4.6-несколько-переключателей-чист.flp
[/spoiler]
т.к. скрипты оптимизированы (
https://closure-compiler.appspot.com/home ), то код скрипта с комментами:
[spoiler]
////////////////////////////////////////////////основная секция скриптов:////////////////////////////////////
/*------эти переменные нужны чтобы стили переключателей не переключались при каждом получении новых данных из контроллера------*/
/* для того чтоб стили не переключались при каждом получении переменной "v", вводим переменную "Rtrigger", */
/*которую объявляем в разделе "основной скрипт на странице (объявляем ее там для того чтобы она была доступна Глобально, */
/*(т.е. там она объявляется как ГЛОБАЛЬНАЯ переменная) в разделе "основной скрипт на странице" */
var Rtrigger=0;
var Rtrigger2=0;
var Rtrigger3=0;
var Rtrigger4=0;
var Rtrigger5=0;
/////////////////////////////////////////////////скрипты переключателей/////////////////////////
<!--html код переключателя -->
<div class="switch-btn" id="off"></div>
<script>
/*когда нажали на переключатель*/
document.getElementById("off").onclick = function(){
/*присваиваем переменной off значения элемента с ID=off*/
var off = document.getElementById("off");
/*если имя стиля элемента с ID=off равно "switch-btn", то посылаем в МК false*/
if(off.className=="switch-btn"){
/*вывод в консоль браузера для отладки*/
console.log("-отправляем true в ESP из веб");
sUH("S1",true);
}
/*иначе если имя стиля элемента с ID=off равно "switch-btn switch-on", то посылаем в МК true*/
else if (off.className=="switch-btn switch-on"){
/*вывод в консоль браузера для отладки*/
console.log("-отправляем false в ESP из веб");
sUH("S1",false);
}
}
</script>
/* для того чтоб стили не переключались при каждом получении переменной "v", вводим переменную "Rtrigger", */
/*которую объявляем (объявляем ее там для того чтобы она была доступна здесь, */
/*т.е. там она объявляется как ГЛОБАЛЬНАЯ переменная) в разделе "основной скрипт на странице" */
/*когда из ESP приходит переменная v и ее значение 1*/
if (v==1 && Rtrigger==0){
/*то присваиваем переключателю с ID=off класс с именем switch-btn switch-on */
document.getElementById("off").className="switch-btn switch-on";
Rtrigger=1;
}
/*когда из ESP приходит переменная v и ее значение 0*/
else if (v==0 && Rtrigger==1){
/*то присваиваем переключателю с ID=off класс с именем switch-btn */
document.getElementById("off").className="switch-btn";
Rtrigger=0;
}
//////////////////////////////
<!--html код переключателя -->
<div class="switch-btn2" id="off2"></div>
<script>
/*когда нажали на переключатель*/
document.getElementById("off2").onclick = function(){
/*присваиваем переменной off2 значения элемента с ID=off2*/
var off2 = document.getElementById("off2");
/*если имя стиля элемента с ID=off2 равно "switch-btn2", то посылаем в МК false*/
if(off2.className=="switch-btn2"){
/*вывод в консоль браузера для отладки*/
console.log("-отправляем true в ESP из веб");
sUH("S2",true);
}
/*иначе если имя стиля элемента с ID=off равно "switch-btn2 switch-on2", то посылаем в МК true*/
else if (off2.className=="switch-btn2 switch-on2"){
/*вывод в консоль браузера для отладки*/
console.log("-отправляем false в ESP из веб");
sUH("S2",false);
}
}
</script>
/*когда из ESP приходит переменная v и ее значение 1*/
if (v==1 && Rtrigger2==0){
/*то присваиваем переключателю с ID=off2 класс с именем switch-btn2 switch-on2*/
document.getElementById("off2").className="switch-btn2 switch-on2";
Rtrigger2=1;
}
/*когда из ESP приходит переменная v и ее значение 0*/
else if (v==0 && Rtrigger2==1){
/*то присваиваем переключателю с ID=off2 класс с именем switch-btn2*/
document.getElementById("off2").className="switch-btn2";
Rtrigger2=0;
}
/////////////////////////////
<!--html код переключателя -->
<div class="switch-btn3" id="off3"></div>
<script>
/*когда нажали на переключатель*/
document.getElementById("off3").onclick = function(){
/*присваиваем переменной off3 значения элемента с ID=off3*/
var off3 = document.getElementById("off3");
/*если имя стиля элемента с ID=off3 равно "switch-btn3", то посылаем в МК false*/
if(off3.className=="switch-btn3"){
/*вывод в консоль браузера для отладки*/
console.log("-отправляем true в ESP из веб");
sUH("S3",true);
}
/*иначе если имя стиля элемента с ID=off3 равно "switch-btn3 switch-on3", то посылаем в МК true*/
else if (off3.className=="switch-btn3 switch-on3"){
/*вывод в консоль браузера для отладки*/
console.log("-отправляем false в ESP из веб");
sUH("S3",false);
}
}
</script>
/*когда из ESP приходит переменная v и ее значение 1*/
if (v==1 && Rtrigger3==0){
/*то присваиваем переключателю с ID=off3 класс с именем switch-btn3 switch-on3*/
document.getElementById("off3").className="switch-btn3 switch-on3";
Rtrigger3=1;
}
/*когда из ESP приходит переменная v и ее значение 0*/
else if (v==0 && Rtrigger3==1){
/*то присваиваем переключателю с ID=off3 класс с именем switch-btn3*/
document.getElementById("off3").className="switch-btn3";
Rtrigger3=0;
}
///////////////////////////////
<!--html код переключателя -->
<div class="switch-btn4" id="off4"></div>
<script>
/*когда нажали на переключатель*/
document.getElementById("off4").onclick = function(){
/*присваиваем переменной off4 значения элемента с ID=off4*/
var off4 = document.getElementById("off4");
/*если имя стиля элемента с ID=off4 равно "switch-btn4", то посылаем в МК false*/
if(off4.className=="switch-btn4"){
/*вывод в консоль браузера для отладки*/
console.log("-отправляем true в ESP из веб");
sUH("S4",true);
}
/*иначе если имя стиля элемента с ID=off4 равно "switch-btn4 switch-on4", то посылаем в МК true*/
else if (off4.className=="switch-btn4 switch-on4"){
/*вывод в консоль браузера для отладки*/
console.log("-отправляем false в ESP из веб");
sUH("S4",false);
}
}
</script>
/*когда из ESP приходит переменная v и ее значение 1*/
if (v==1 && Rtrigger4==0){
/*то присваиваем переключателю с ID=off4 класс с именем switch-btn4 switch-on4*/
document.getElementById("off4").className="switch-btn4 switch-on4";
Rtrigger4=1;
}
/*когда из ESP приходит переменная v и ее значение 0*/
else if (v==0 && Rtrigger4==1){
/*то присваиваем переключателю с ID=off4 класс с именем switch-btn4*/
document.getElementById("off4").className="switch-btn4";
Rtrigger4=0;
}
////////////////////////////////
<!--html код переключателя -->
<div class="switch-btn5" id="off5"></div>
<script>
/*когда нажали на переключатель*/
document.getElementById("off5").onclick = function(){
/*присваиваем переменной off значения элемента с ID=off5*/
var off5 = document.getElementById("off5");
/*если имя стиля элемента с ID=off5 равно "switch-btn5", то посылаем в МК false*/
if(off5.className=="switch-btn5"){
/*вывод в консоль браузера для отладки*/
console.log("-отправляем true в ESP из веб");
sUH("S5",true);
}
/*иначе если имя стиля элемента с ID=off5 равно "switch-btn5 switch-on5", то посылаем в МК true*/
else if (off5.className=="switch-btn5 switch-on5"){
/*вывод в консоль браузера для отладки*/
console.log("-отправляем false в ESP из веб");
sUH("S5",false);
}
}
</script>
/*когда из ESP приходит переменная v и ее значение 1*/
if (v==1 && Rtrigger5==0){
/*то присваиваем переключателю с ID=off5 класс с именем switch-btn5 switch-on5*/
document.getElementById("off5").className="switch-btn5 switch-on5";
Rtrigger5=1;
}
/*когда из ESP приходит переменная v и ее значение 0*/
else if (v==0 && Rtrigger5==1){
/*то присваиваем переключателю с ID=off5 класс с именем switch-btn5*/
document.getElementById("off5").className="switch-btn5";
Rtrigger5=0;
}
[/spoiler]
28.02.2022
все мы любим наш Webupdats 
так вот, решил сделать ещё приятней)
и где расположены.