Как сделать 3 кнопки для выбора разных параметров

Question

Итак, мой код такой, и я хочу выбирать для каждой кнопки разные параметры в моей голове, это имеет смысл, но это не работает, каков правильный синтаксис? потому что, если я нажму кнопку «Пуск» (Easy), она будет считаться неопределенной, что должно начинаться с первого параметра no? если значение Normal не определено, оно должно начинаться со второго, я не знаю, почему это не работает

<button type="button" onclick="start(Easy)" id="startEasy">Lahká</button>
<button type="button" onclick="start(Normal)" id="startNormal">Stredná</button>
<button type="button" onclick="start(Hard)" id="startHard">Tážká</button>

  function start(Easy, Normal, Hard) {
        if (Easy === undefined) {
        document.getElementById("diffi").style.display = "none";
        document.getElementById("startNormal").style.display = "none";
        document.getElementById("startHard").style.display = "none";
        document.getElementById("startEasy").style.display = "none";
        document.getElementById("hideEasy").style.display = "block";
        document.getElementById("gratulujem").innerHTML = "Zadajťe hodnotu:";
        document.getElementById("rules").style.display = "none";
        document.getElementById("numbEasy").style.display = "inline-block";
        document.getElementById("pocet").style.display = "block";
        document.getElementById("odpovedEasy").style.display = "block";
        document.getElementById("odpovedNormal").style.display = "block";
        document.getElementById("odpovedHard").style.display = "block";
        document.getElementById("numbEasy").focus();
        document.getElementById("odpovedEasy").innerHTML = "Zadajte číslo 1..20";
        document.getElementById("vsetko").style.maxHeight = "350px";
        }
      else if (Normal === undefined) {
        document.getElementById("diffi").style.display = "none";
        document.getElementById("startNormal").style.display = "none";
        document.getElementById("startHard").style.display = "none";
        document.getElementById("startEasy").style.display = "none";
        document.getElementById("hideNormal").style.display = "block";
        document.getElementById("gratulujem").innerHTML = "Zadajťe hodnotu:";
        document.getElementById("rules").style.display = "none";
        document.getElementById("numbNormal").style.display = "inline-block";
        document.getElementById("pocet").style.display = "block";
        document.getElementById("odpovedEasy").style.display = "block";
        document.getElementById("odpovedNormal").style.display = "block";
        document.getElementById("odpovedHard").style.display = "block";
        document.getElementById("numbNormal").focus();
        document.getElementById("odpovedNormal").innerHTML = "Zadajte číslo 1..50";
        document.getElementById("vsetko").style.maxHeight = "350px";
        }
      else {
        document.getElementById("diffi").style.display = "none";
        document.getElementById("startNormal").style.display = "none";
        document.getElementById("startHard").style.display = "none";
        document.getElementById("startEasy").style.display = "none";
        document.getElementById("hideHard").style.display = "block";
        document.getElementById("gratulujem").innerHTML = "Zadajťe hodnotu:";
        document.getElementById("rules").style.display = "none";
        document.getElementById("numbHard").style.display = "inline-block";
        document.getElementById("pocet").style.display = "block";
        document.getElementById("odpovedEasy").style.display = "block";
        document.getElementById("odpovedNormal").style.display = "block";
        document.getElementById("odpovedHard").style.display = "block";
        document.getElementById("numbHard").focus();
        document.getElementById("odpovedHard").innerHTML = "Zadajte číslo 1..100";
        document.getElementById("vsetko").style.maxHeight = "350px";
      }
  }

Answer 1

У вас есть function с тремя параметрами, и для каждой кнопки вы пытаетесь передать значение для первого параметра, но эти значения равны undefined. Сначала вам нужно определить эти значения (для простоты я опишу их глобально, но позже вы можете изменить код):

var Easy = 'Easy';
var Normal = 'Normal';
var difficult = 'Difficult';

и тогда эти кнопки должны работать:

<button type="button" onclick="start(Easy)" id="startEasy">Lahká</button>
<button type="button" onclick="start(Normal)" id="startNormal">Stredná</button>
<button type="button" onclick="start(Hard)" id="startHard">Tážká</button>

Мы можем упростить вашу function лот, например, вам не нужно if или switch, просто используйте полученный вами параметр:

  function start(difficulty) {
        document.getElementById("diffi").style.display = "none";
        document.getElementById("startNormal").style.display = "none";
        document.getElementById("startHard").style.display = "none";
        document.getElementById("startEasy").style.display = "none";
        document.getElementById("hide" + difficulty).style.display = "block";
        document.getElementById("gratulujem").innerHTML = "Zadajťe hodnotu:";
        document.getElementById("rules").style.display = "none";
        document.getElementById("numb" + difficulty).style.display = "inline-block";
        document.getElementById("pocet").style.display = "block";
        document.getElementById("odpovedEasy").style.display = "block";
        document.getElementById("odpovedNormal").style.display = "block";
        document.getElementById("odpovedHard").style.display = "block";
        document.getElementById("numb" + difficulty).focus();
        document.getElementById("odpoved" + difficulty).innerHTML = "Zadajte číslo 1..20";
        document.getElementById("vsetko").style.maxHeight = "350px";
  }

Answer 2

Вот мое решение:

<button type="button" onclick="Start('easy')" id="startEasy">Lahká</button>
<button type="button" onclick="Start('normal')" id="startNormal">Stredná</button>
<button type="button" onclick="Start('hard')" id="startHard">Tážká</button>

function Start(mode)
{
   switch(mode)
   {
     case 'easy' :
       // Do it easy.
       break;

     case 'normal' :
       // Do it normal.
       break;

     case 'hard' :
       // Do it hard.
       break;

     // In this case undefined and default is the same thing,
     // This can be simplified just by default.
     // case 'undefined' :
     default :
      // Do it as you want if undefined.
      // Do it easy for example.
      break;
   }
}