Переключить кнопку можно / отключить класс - PullRequest
Новая
       32

Переключить кнопку можно / отключить класс

0 голосов
/ 22 апреля 2020

У меня есть 3 кнопки:

  • Первая скрывает все столбцы таблицы, используя background-color: черный.
  • Вторая показывает снова все столбцы (background-color : white).
  • Третий должен переключаться между столбцами show / hide 1, указанными c.

Первые 2 в порядке.
На данный момент я был просто можно создать третью кнопку, чтобы снова показывать контент, когда он уже имеет черный фон, но он не может снова получить белый фон (без переключения). 

//here is the third button, the one I need to edit

<div id="main>
    <div>
       <button id="itaButton" class="flagButtons" type="button" onclick="showIta()"></button>
    </div>
</div>

//and here the first element of one column that is supposed to be hidden by the button
<td><p class="italian tableElement">text</p></td>

//CSS
.tableElement {
        background-color: black;
    }

.tableElement:hover {
        background-color: white; }


//Javascript
//The first two are ok
    function showAll() {
var x = document.getElementById("main");
var y = x.getElementsByClassName("tableElement");
var i;
for (i = 0; i < y.length; i++) {
  y[i].style.backgroundColor = "white";
}
}

function hideAll() {
var x = document.getElementById("main");
var y = x.getElementsByClassName("tableElement");
var i;
for (i = 0; i < y.length; i++) {
  y[i].style.cssText = "backgroundColor: black; backgroundColor:hover: white";
}
}

//This is the one I should edit
function showIta() {
var x = document.getElementById("main");
var y = x.getElementsByClassName("italian");
var i;
for (i = 0; i < y.length; i++) {
  y[i].style.backgroundColor = "white";
}
}
...