Jquery UI:如何将选择选项更改回默认值?

时间:2013-02-13 14:05:58

标签: jquery xhtml

我正在使用jquery ui从这个例子中创建我的选择选项菜单

Jquery selectmenu examples

在用户选择了option1,option2或选项3并且值已完成输出/即一旦事件ss完成后,是否可以将选择选项更改回默认值,它应该更改回“选择”一个..“。

<script type="text/javascript"> 
        $(function(){       

            // please note that option.event is always passed as a string, so do not test for true or 1 with if (options.value)
            // see this issue for more information http://github.com/fnagel/jquery-ui/issues#issue/12
            var speedD_first = $('select#speedD_first').selectmenu();       
           // alert(speedD_first[0]);


           // var selVal=$('select#speedD_first').selectmenu("value");
            //alert(selVal);
            $('select').selectmenu({
                change: function(e, object){
                    alert(object.value);
                }
            });

            //$('select').show();
        });     
        $(document).ready(function() {
            $("select#speedD_first").change(function() {
              var selVal=$("select#speedD_first").val();
            //  alert(selVal);
            });

        });
    </script>

<fieldset>
            <label for="speedD_first">Disabled and selected first option by HTML</label>
            <select id="speedD_first">
                <option disabled="disabled" selected="selected">Choose one...</option>
                <option value="option1">Option 1</option>
                <option value="option2">Option 2</option>
                <option value="option3">Option 3</option>
            <select>
        </fieldset>

2 个答案:

答案 0 :(得分:1)

您可以更改原始选择的值,然后对窗口小部件使用refresh方法

在演示页面的控制台中运行:

$('#number').val(3).selectmenu('refresh');

因此设置默认选项的值,如果没有值,则设置空字符串

答案 1 :(得分:0)

jQuery UI documentation讨论refresh方法,但在我的测试中,它似乎不起作用。这可能是由于selectmenu是一个仍处于规划阶段的非最终jQuery UI组件。相反,再次调用.selectmenu()似乎是有效的,并且它被提及为development version documentation中更改状态的方法。

注意:我使用的是插件的最新开发版本(JS / CSS)。

$('select').selectmenu({
    change: function (e) {

        // Do something
        alert('Just to pause');

        // Rever to original value and reset
        $(this).val(0);
        $(this).selectmenu();
    }
});

jsfiddle