Question

http://jsbin.com/uluwum/3/edit

我有一个美国州的选择列表，我只希望默认显示两个字母的缩写版本，并且选择了不同的状态。因此，当选择列表处于默认状态时，它需要显示所选值而不是所选文本，但在单击时仍显示选项文本，但我无法弄清楚如何执行此操作。我认为这不会是一件困难的事情，但我所尝试的搜索都是基于以下情况，以至于没有返回相关结果，或者这是一个不寻常的请求。

我把我极其蹩脚的尝试放在上面的JSBin示例中。

提前致谢！

保

Answer 1

$(function(){
        $('#states option').each(function(){
            $(this).attr('data-text', $(this).text());
            if($(this).is(':selected') == false)
            {
               $(this).text($(this).val());
            }        
        });

        $('select').on('change', function(){
            reset();
            var selected = $('option:selected');
            selected.text(selected.attr('data-text'));
        });

        function reset()
        {
          $('#states option').each(function(){
            $(this).text($(this).val());
          });  
        }
    });

http://jsfiddle.net/UMs98/2/

这应该做你想要的。

Answer 2

这与我的情况差不多： jsFiddle example

$('select option').each(function() {
    $(this).data('abbr', $(this).val());
    $(this).data('full', $(this).text());
    $(this).text($(this).val());
});
$('select').change(function() {
    $('option:selected', this).text($('option:selected', this).data('full'));
    $('option:not(":selected")', this).each(function(){
        $(this).text($(this).data('abbr'));
    });
});

需要选择列表来显示值，而不是文本

2 个答案: