Есть ли способ щелкнуть по опции, а под ней есть всплывающее окно?

Question

Я пытаюсь выбрать опцию «всплывающее окно», когда нажимаю.Я новичок в javascript, CSS и HTML, поэтому я прошу прощения перед ошибкой за код ошибки

, поэтому я использовал опцию onclick на javascript, но она не работает, я не знаю, что я делаю неправильно,"panelIss" - это ссылка на другой htm-файл, который принесет другие параметры.

<form action="/action_page.php">
  <fieldset>
    <legend>Equipment Status</legend>
    Select Equipment:
    <select>
      <option value=none>-Select from list-</option>
      <option
        value="panel"
        onclick="document.getElementById('panelIss').innerHTML"
      >
        Panel
      </option>
      <option value="doorWindsens">Door/Window sensor</option>
      <option value="camera">Camera</option>
      <option value="doorbell">Door Bell Camera</option>
    </select>   
  </fieldset>
</form>

В идеале, я хочу, чтобы, как только вы нажмете "Panel", под ней появится еще один параметр.

Answer 1

<option> элементы не запускают событие click во всех браузерах, вам следует избегать полагаться на это.

Однако вы можете использовать onChange() при выборе и проверять выбранное значение.

<script>
        function changeFunc() {
            var e = document.getElementById('viewby');
            var answer = e.options[e.selectedIndex].text;

            //alert(answer);

            if(answer == 'Panel') {
                // do something
            }
        }
    </script>

    <form action="/action_page.php">
    <fieldset>
    <legend>Equipment Status</legend>
    Select Equipment:
    <select onchange="changeFunc(this);" id="viewby">
    <option value=none>-Select from list-</option>
    <option value="panel">Panel</option>
    <option value="doorWindsens">Door/Window sensor</option>
    <option value="camera">Camera</option>
    <option value="doorbell">Door Bell Camera</option>
    </select>   
    </fieldset>