引导选择选项显示值而不是文本 [英] bootstrap select option display value instead of text

问题描述

这可能已经被回答了，但我不认为这个特定的问题已经得到回答。

我有一个保管箱（选择&选项）和我希望在未选择保管箱时显示屏幕上的值，并在选择该文件夹时显示文本。

示例：

 < select id =inputmsgTypeclass =form-control width-90> 
< option value = 0> description0< / option> 
< option value = 1> description1< / option> 
< option value = 2> description2< / option> 
< / select> 
  

所以当我想选择一个选项时，我想显示说明。
但是，我想在dropbox字段本身中显示所选选项的值
（当我没有选择某项时）

这是可能吗？

提前感谢

解决方案

/ p>

Bootply ： http：// www.bootply.com/128894

JS ：

<$ p $（$＃code）$（'＃inputmsgType'）。on（'change mouseleave'，function（）{
$（'＃inputmsgType option' b $（this）.html（$（this）.attr（'desc'））;
}）;
$（'＃inputmsgType选项：selected'）。html（$（'＃inputmsgType选项：selected'）。attr（'value'））;

}）;

$（'＃inputmsgType'）。on（'mouseover'，function（）{
$（'＃inputmsgType option'）。each（function（）{
$ （this）.html（$（this）.attr（'desc'））;
}）;
}）;

HTML ：

 < select id =inputmsgTypeclass =form-control width-90> 
< option value =0desc =description0> description0< / option> 
< option value =1desc =description1> description1< / option> 
< option value =2desc =description2> description2< / option> 
< / select> 
  

this might have been answered already, but I don't think this particular question has been answered.

I have a dropbox (select & option) and I want to display the value on screen when the dropbox isn't selected and display the text when it is selected

Example:

<select id="inputmsgType" class="form-control width-90">
<option value=0>description0</option>
<option value=1>description1</option>
<option value=2>description2</option>
</select>

So I want to display the descriptions when I want to select an option. But I want to display the value of the selected option in the dropbox field itself (when I'm not selecting something)

is this possible?

Thanks in advance

解决方案

Something like this ?

Bootply : http://www.bootply.com/128894

JS :

$('#inputmsgType').on('change mouseleave', function(){
  $('#inputmsgType option').each(function(){
    $(this).html( $(this).attr('desc') ); 
  });
  $('#inputmsgType option:selected').html(  $('#inputmsgType option:selected').attr('value')   );

});

$('#inputmsgType').on('mouseover', function(){
  $('#inputmsgType option').each(function(){
    $(this).html( $(this).attr('desc') ); 
  });
});

HTML :

<select id="inputmsgType" class="form-control width-90">
<option value="0" desc="description0">description0</option>
<option value="1" desc="description1">description1</option>
<option value="2" desc="description2">description2</option>
</select>

这篇关于引导选择选项显示值而不是文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！