javascript - 如何更改选择框选定的值？这意味着我想显示选定的值，而不是文本？

Question

我想显示选定的值，而不是文本。喜欢

相反

我尝试过以下代码，但对我不起作用，任何帮助将不胜感激

<select class="form-control" name="identity" id="identity">
<option value="CC">Cédula de Ciudadanía</option>
<option value="CE">Cédula Extranjera</option>
<option value="NIT">Nit</option>
<option value="TI">Tarjeta de Identidad</option>
<option value="PPN">Pasaporte</option>
<option value="SSN">Número de Seguridad Social</option>
<option value="LIC">Licencia de Conducción</option>
<option value="DNI">DNI</option>
</select>

但它不应反射(reflect)选择框值

Answer 1

• 在 select 元素上有一个假的 div 元素
• 为fake元素设置pointer-events: none;
• 监听select-element的change事件
• 在 select-element 发生变化时设置 fake 元素的 text

var $identity = $('#identity');
var $fake = $('#fake');
$fake.css($identity[0].getBoundingClientRect());
$identity.on('change', function() {
  $fake.text($(this).find('option:selected').text());
}).change();

#fake {
  pointer-events: none;
  border: 1px solid black;
  padding: 3px;
}
#identity {
  opacity: 0;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<select class="form-control" name="identity" id="identity">
  <option value="CC">Cédula de Ciudadanía</option>
  <option value="CE">Cédula Extranjera</option>
  <option value="NIT">Nit</option>
  <option value="TI">Tarjeta de Identidad</option>
  <option value="PPN">Pasaporte</option>
  <option value="SSN">Número de Seguridad Social</option>
  <option value="LIC">Licencia de Conducción</option>
  <option value="DNI">DNI</option>
</select>
<div id="fake" style="position:absolute;"></div>