【问题标题】:bootstrap select option display value instead of text引导选择选项显示值而不是文本
【发布时间】:2014-04-10 08:31:34
【问题描述】:

这可能已经回答了,但我认为这个特定的问题还没有回答。

我有一个保管箱(选择和选项),我想在未选择保管箱时在屏幕上显示值,并在选中时显示文本

例子:

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

所以我想在我想选择一个选项时显示描述。 但我想在 Dropbox 字段本身中显示所选选项的值 (当我没有选择某些东西时)

这可能吗?

提前致谢

【问题讨论】:

    标签: jquery twitter-bootstrap drop-down-menu


    【解决方案1】:

    这样的?

    引导层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>
    

    【讨论】:

      【解决方案2】:

      使用 Jquery 代码,试试这个:

      $('#inputmsgType').click(function() {
                  $('#description').html("Option value is:" + $('#inputmsgType').val() +
                          "<br>Option Description is: " + $('#inputmsgType option:selected').text());
              });
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2013-01-27
        • 2018-01-22
        • 2019-11-18
        • 2017-05-14
        相关资源
        最近更新 更多