0

Есть два дива и код:

document.querySelector('.but3').onclick = function() {                  
    img--;
    SaveFon();                  
}

document.querySelector('.but4').onclick = function() {                  
    img++;
    SaveFon();                  
}

Соответственно LS тоже есть, просто это не в тему. Так вот, необходимо, чтобы при каждом нажатии на див "but3" переменная изменялась на "1" в меньшую сторону. А при нажатии на "but4" - прибавлялась на "1". Но при этом, чтобы меньше "1" быть не могло, т.е. если переменная "1" и нажать на "but3", то число станет равно "20". Как и если дойдёт до числа 20 (нажатием на but4), автоматически число снова стало "1".

Не могу понять как это реализовать.

2 ответа 2

0

Для этого нужно использовать условный оператор if

Нужно проверить текущее значение:

if (img == 20) 
if (img == 1)

И в зависимости от результата присвоить нужное значение:

document.querySelector('.but3').onclick = function() {                  
    if(img == 1){ // если переменная "1"
        img = 20; // то число станет равно "20"
    }else{ // иначе
        img--; // все как было
    }
    SaveFon();                  
}

document.querySelector('.but4').onclick = function() {                  
    if(img == 20){ // если дойдёт до числа 20 
        img = 1; // автоматически число снова стало "1"
    }else{ // иначе
        img++; // все как было
    }
    SaveFon();                  
}

либо можно использовать тернарный оператор

document.querySelector('.but3').onclick = function() {                  
    img = img == 1 ? 20 : img-1;
    SaveFon();                  
}
3
  • Вроде всё отлично работает, но не подскажите еще.. используя первый вариант, при нажатии на див, который увеличивает переменную на "1".. при нажатии еще раз, переменная уже не увеличивается и всё равно равна "1". Как это исправить?
    – user250973
    1 июн 2017 в 11:58
  • @user250973, странно, такого поведения не должно быть: jsfiddle.net/x8n81xjp
    – Grundy
    1 июн 2017 в 12:46
  • всё, проблема решилась.. по-другому, спасибо!)
    – user250973
    1 июн 2017 в 13:14
0

var img = 0;
document.querySelector('.but3').onclick = function() {
  img--;
  if(img<1)img=20;
  console.log(img);
}

document.querySelector('.but4').onclick = function() {
  img++;
  if(img>20)img=0;
  console.log(img);
}
<button class='but3'>-</button>
<button class='but4'>+</button>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.