Как добавить несколько утверждений

Question

Прямо сейчас у меня есть форма, где вы вводите и отправляете свой возраст, и при нажатии кнопки появляется текст.Сейчас есть два разных текста: один для тех, кто младше 18 лет, и один для старше 18 лет.

Я хочу сделать текст для 0 - 17, 18 - 25, 26 - 30 и так далее.Но как мне это сделать?

В основном это форма, в которой вы получаете разные результаты независимо от того, должны ли вы курить.

<input id="age" value="18" class="text-center" />
<button onclick="myFunction()" type="button"> trigger </button>    

<h1 id="dontsmoke"></h1>

<script>
    function myFunction() {
        var age, smokeable;
        age = document.getElementById("age").value;
        smokeable = (age < 18) ? "Don't smoke" : "Still, don't smoke";
        document.getElementById("dontsmoke").innerHTML = smokeable + "...";
    }
</script>

Answer 1

В основном, используйте обычный блок if-else, я предложу этот способ для удобства чтения, вместо использования нескольких троичных операторов

if (age <= 17) { 
   smokeable = "Don't smoke"; 
} else if (age >= 18 && age <=25) { 
   smokeable = "Still, don't smoke"
} else if (age >= 26 && age <=30) {
   smokeable = "Still don't smoke, but you are old enough to decide for yourself";
} else {
   smokeable = "Do whatever you want";
}

, как предложил @ nawed-khan, вы также можете использовать оператор switch

switch (true) {
    case (age < 18):
        smokeable = "Don't smoke";
        break;
    case (age < 26):
        smokeable = "Still, don't smoke"
        break;
    case (age < 30):
        smokeable = "Still don't smoke, but you are old enough to decide for yourself";
        break;
    default:
        smokeable = "Do whatever you want";
        break;
}

Answer 2

Вместо множественных уравнений if / else или троичных уравнений - используйте оператор switch , который допускает серию условий и результирующие действия, если условие соответствует.

Обратите внимание на использование (true) в операторе switch - это означает, что когда указанное условие == true - выполнить это действие.

function myFunction() {
    var age, smokeable;
    age = parseInt(document.getElementById("age").value);
    switch(true) {
    case age > 17 && age <= 25:
      smokeable = "Still too young to smoke";
      break;
     case age > 25 && age <=30:
      smokeable = "Smoke 'em if you got 'em";
      break;
    default:
      smokeable = "Don't smoke";
  }

   document.getElementById("dontsmoke").innerHTML = smokeable + "...";
}

<input id="age" value="18" class="text-center" />
<button onclick="myFunction()" type="button"> trigger </button>
<h1 id="dontsmoke"></h1>

Answer 3

Просто соедините своего троичного оператора следующим образом:

function myFunction() {
    var age, smokeable;
    age = document.getElementById("age").value;
    smokeable = (age < 18) ? "A" : (age > 17 && age < 26) ? "B" : (age >25 && age < 31) ? "C" : "Outside of age range";
}

---

jsFiddle с подходом Ternary Operator : http://jsfiddle.net/AndrewL64/3jys6fah/4/

---

Или вы можете использовать стандартный подход if/else следующим образом:

function myFunction() {
    var age, smokeable;
    age = document.getElementById("age").value;

    if(age < 18) {
        smokeable = "A";
    }
    else if(age > 17 && age < 26) {
        smokeable = "B";
    }
    else if(age > 25 && age < 31) {
        smokeable = "C";
    }
    else {
        smokeable = "Outside of age range";
    }
}

---

jsFiddle со стандартным if/else оператором подход: http://jsfiddle.net/AndrewL64/3jys6fah/7/

---

Или вы можете использовать подход switch оператор следующим образом:

var age = document.getElementById("age").value;
switch (true) {
    case (age < 18):
        smokeable = "A";
        break;
    case (age < 26):
        smokeable = "B";
        break;
    case (age < 31):
        smokeable = "C";
        break;
    default:
        smokeable = "Outside of age range";
    }

---

jsFiddle с switch оператор подход: http://jsfiddle.net/AndrewL64/3jys6fah/14/