Форум

новый вася · #1 (**permalink**) 24.01.2015, 20:02

Ребята помогите пожалуйста, при перезагрузке страницы слетает цвет селекта в дефолт вот код

<style>
.n {
    font-weight:bold;
    font-size:18px;
    background:#E19D9D; color: #5E5E5E;
    border: 0px;
    padding: 10px;
    -webkit-appearance: none;appearance: none;-moz-appearance: none;
}
.y {
    font-weight:bold;
    font-size:18px;
    background:#9DE1A0; color: #5E5E5E;
    border: 0px;
    padding: 10px;
    -webkit-appearance: none;appearance: none;-moz-appearance: none;
}
</style>
<table>
<tbody>
<tr>
<td style="width: 5px; text-align: center;">
<select class="n" onclick="className=selectedIndex?'y':'n';" id="fruit">
    <option class="n" value="0">Ожидание</option>
    <option class="y" value="1">Отправлен</option>
</select></td>
<td style="width: 50px; text-align: center;">Ячейка №1</td>
<td style="width: 50px; text-align: center;">Ячейка №2</td>
<td style="width: 50px; text-align: center;">Ячейка №3</td>
</tr>
</tbody>
</table>
<script>
document.getElementById("fruit").onchange = function(ter) {
    localStorage.setItem('fruit', document.getElementById("fruit").value);
}

if (localStorage.getItem('fruit')) {
    document.getElementById("fruit").options[localStorage.getItem('fruit')].selected = true;
}
</script>

кто может ткните меня носом что не так уже два часа как пытаюсь
простите в js еще новичек
если есть у кого идея более простой реализации этого момента с радостью выслушаю

новый вася · #2 (**permalink**) 24.01.2015, 20:41

к сожалению не помогло
если так, то слетает полностью все значение при перезагрузке страницы, даже текст

новый вася · #3 (**permalink**) 24.01.2015, 20:43

может с чекбоксом аля так попробовать

<input type="checkbox" id="stat">

<script>
document.getElementById('stat').onclick = function() {
  if(document.getElementById('stat').checked) {
    localStorage.setItem('stat', "true");
  } else {
    localStorage.setItem('stat', "false");
  }
}
if (localStorage.getItem('stat') == "true") {
  document.getElementById("stat").setAttribute('checked','checked');
}
</script>

только не пойму как css привязать свой сюда

рони · #4 (**permalink**) 24.01.2015, 21:55

новый вася,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
</head>

<body>
<style>
.n {
    font-weight:bold;
    font-size:18px;
    background:#E19D9D; color: #5E5E5E;
    border: 0px;
    padding: 10px;
    -webkit-appearance: none;appearance: none;-moz-appearance: none;
}
.y {
    font-weight:bold;
    font-size:18px;
    background:#9DE1A0; color: #5E5E5E;
    border: 0px;
    padding: 10px;
    -webkit-appearance: none;appearance: none;-moz-appearance: none;
}
</style>
<table>
<tbody>
<tr>
<td style="width: 5px; text-align: center;">
<select class="n"  id="fruit">
    <option class="n" value="0">Ожидание</option>
    <option class="y" value="1">Отправлен</option>
</select></td>
<td style="width: 50px; text-align: center;">Ячейка №1</td>
<td style="width: 50px; text-align: center;">Ячейка №2</td>
<td style="width: 50px; text-align: center;">Ячейка №3</td>
</tr>
</tbody>
</table>
<script>
document.getElementById("fruit").onchange = function(ter) {
    localStorage.setItem('fruit', this.value);
    document.getElementById("fruit").className = ["n","y"][this.value];
}

if (localStorage.getItem('fruit') != null) {
    document.getElementById("fruit").value = localStorage.getItem('fruit');
    document.getElementById("fruit").className = ["n","y"][localStorage.getItem('fruit')];
}
</script>

</body>

</html>

новый вася · #5 (**permalink**) 24.01.2015, 22:02

огромное спасибо работает ))

новый вася · #6 (**permalink**) 24.01.2015, 22:56

но все равно к сожалению если добавить на страницу еще одну такую же таблицу то элемент в ней все равно работает не корректно ( слетает при перезагрузке))
Все еще в поисках решения, заранее всем спасибо.....

рони · #7 (**permalink**) 24.01.2015, 23:34

новый вася,

Сообщение от новый вася

работает не корректно

где код для множества таблиц?

новый вася · #8 (**permalink**) 24.01.2015, 23:43

предполагаю что при добавлении счетчика i++ для каждого следующего элемента, функционал этого кода будет соответствовать требуемому, но к сожалению мои знания в сфере js реализовать этого не позволяют

Ostinems · #9 (**permalink**) 14.02.2015, 20:19

Помогите с сайтом bytovaytehnika.ru , при переходе в любую под категорию bytovaytehnika.ru/malaya/blender - сайт слетает, задний фон стирается и становиться полностью кривым

Форум

Справочник

Discord чат

Курсы javascript