javascript - 执行函数时不出现输入

Question

我需要当单击选择的选项“otros”时，会出现一个输入。为此，我制作了这个无法正常工作的脚本(输入不出现)。

html/php

<select onclick='atencion_otros()' id="atencion" name="atencion">
    <option selected>Atención</option>
    <option>Otros</option>
    <?php if($copy){ echo '<option selected>' . $atencion . '</option>';
    $result = mysqli_query($con,"SELECT * FROM `contactos_pmt` ORDER BY nombre_contacto");
    while($row = mysqli_fetch_array($result)){
     ?> <option> <?php echo $row['nombre_contacto']; ?> </option>
     <br><br><?php
     }
    }
    if($cargar_cliente){
    $result = mysqli_query($con,"SELECT * FROM `contactos_pmt` WHERE 
    nombre_empresa = '$nombre_cliente' ORDER BY nombre_contacto");
    while($row = mysqli_fetch_array($result)){
     ?> <option selected> <?php echo $row['nombre_contacto']; ?> </option>
     <br><br><?php
     }
    }
    ?>
</select>
<input onkeypress="return event.keyCode != 13;" style="display:none;" id="atencion_otros" name="atencion_otros" placeholder="Atención" />

Javascript

<script type="text/javascript">
  function atencion_otros() {
    if (document.getElementById('atencion').value == 'Otros') {
        document.getElementById('atencion_otros').style.display = 'block';
    } else {
        document.getElementById('atencion_otros').style.display = 'none';
    }
  }
</script>

您知道为什么输入没有出现吗？

Answer 1

首先在所有 <option> 中添加值属性.

然后添加事件监听器。

document.addEventListener('DOMContentLoaded',function() {
    document.getElementById('atencion').onchange=atencion_otros;
},false);

现在你的函数

function atencion_otros() {
    if (document.getElementById('atencion').value == 'Otros') {
        document.getElementById('atencion_otros').style.display = 'block';
    } else {
        document.getElementById('atencion_otros').style.display = 'none';
    }
  }

现在从 <select> 中删除 onclick 属性.