Кнопка включения Javascript - PullRequest
Новая
       17

Кнопка включения Javascript

0 голосов
/ 18 сентября 2018

Я создаю форму с HTML и JavaScript.Мне нужно показать идентификатор div в зависимости от 2 кнопок, нажатых на первые 2 варианта - если год выпуска автомобиля 2019, а марка автомобиля - ACURA, тогда показать идентификатор div для моделей Acura 2019 года.

Вот код -Я действительно застрял в создании оператора функции для проверки предыдущих нажатий кнопок и отображения нового идентификатора div "model".Есть ли лучший способ? 

<form>
<h4> Auto Insurance Quote </h4> <br>
<div id= "year">
<input type= "button" id="showform" 
value="2019" name="showform" 
onclick="showhideForm(this.value);"</button>
<input type= "button" id="b2018" value="2018" 
name="showform" 
onclick="showhideForm(this.value);"</button>
<input type= "button" id="showform" 
value="2017" name="showform" 
onclick="showhideForm(this.value);"</button>
<input type= "button" id="showform" 
   value="2016" name="showform" 
onclick="showhideForm(this.value);"</button>
</div>
</form>

<script type="text/javascript">
function showhideForm(showform) {
if (showform == "2019") {

 document.getElementById("div1").style.display 
  = 
 'block';

 document.getElementById("year").style.display 
  = 
 'none';

   }

    if (showform == "2018") {

 document.getElementById("div1").style.display 
 = 'block';

  document.getElementById("year").style.display 
   = 'none';
   }

      if (showform == "2017") {

  document.getElementById("div1").style.display 
 = 'block';

  document.getElementById("year").style.display 
  = 'none';
   }
    if (showform == "2016") {

  document.getElementById("div1").style.display 
   = 'block';


 document.getElementById("year").style.display 
 = 'none';
  }
  }


     </script>

     <div id="div1" style="display:none">
    <input type= "button" id="acura" 
   value="ACURA" name="showform" 
    onclick="myFunction()"</button>
    <input type= "button" id="showform" 
    value="AUDI" name="showform" 
    onclick="showhideForm(this.value);" 
   </button>
    <input type= "button" id="showform" 
   value="BMW" name="showform" 
   onclick="showhideForm(this.value);"</button>
   <input type= "button" id="showform" 
    value="BUICK" name="showform" 
    onclick="showhideForm(this.value);" 
     </button>

    </div>

      <div id= acura_2018 style="display:none">
        <input type= "button" id="showform" 
      value="ILX BASE" name="showform" 
     onclick="showhideForm(this.value);" 
     </button>
        <input type= "button" id="showform" 
      value="ILX PREMIUM" name="showform" 
        onclick="showhideForm(this.value);" 
         </button>
      <input type= "button" id="showform" 
        value="ILX PREMIUM STYLE" 
         name="showform" 
        onclick="showhideForm(this.value);" 
        </button>
      <input type= "button" id="showform" 
      value="ILX SPECIAL EDITION" 
       name="showform" 
        onclick="showhideForm(this.value);" 
        </button>

        </div>

       <script>


       function
      var 2018 
       =document.getElementById("b2018");
         var 2018 
      =document.getElementById("ACURA");

       b2018.onclick = function() 
       }

          </script>

1 Ответ

0 голосов
/ 18 сентября 2018

Добро пожаловать, Даг.Несколько вещей, о которых я могу подумать: ваша функция, передающая значение кнопок, могла бы просто сохранить это как переменную, подобную этой: 

strYear = showform;
//You only needs these lines once:
document.getElementById("div1").style.display = 'block';
document.getElementById("year").style.display = 'none';

Сделайте то же самое для модели и ее функции: 

strModel = showform;

Тогда, если после вашего div делайте: 

var divIdentified = document.getElementById(strYear + strModel);

Подумайте, что вы ищете.Вам не нужны все эти заявления if, если вы не планируете делать что-то еще.Также я бы взглянул на операторы switch.Это сделало бы ваш код более аккуратным и эффективным, когда вам нужно использовать много ifs.

Надеюсь, это поможет

...