diff --git a/examples/routers/select.vue b/examples/routers/select.vue
index b716b2c..ab88428 100644
--- a/examples/routers/select.vue
+++ b/examples/routers/select.vue
@@ -1,206 +1,16 @@
-<!--<template>-->
-    <!--<div>-->
-        <!--<i-select v-model="model1" style="width:200px" clearable>-->
-            <!--<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>-->
-        <!--</i-select>-->
-        <!--{{ model1 }}-->
-        <!--<div @click="c">change</div>-->
-    <!--</div>-->
-<!--</template>-->
-<!--<script>-->
-    <!--export default {-->
-        <!--data () {-->
-            <!--return {-->
-                <!--cityList: [-->
-                    <!--{-->
-                        <!--value: 'beijing',-->
-                        <!--label: '北京市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'shanghai',-->
-                        <!--label: '上海市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'shenzhen',-->
-                        <!--label: '深圳市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'hangzhou',-->
-                        <!--label: '杭州市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'nanjing',-->
-                        <!--label: '南京市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'chongqing',-->
-                        <!--label: '重庆市'-->
-                    <!--}-->
-                <!--],-->
-                <!--model1: ''-->
-            <!--}-->
-        <!--},-->
-        <!--methods: {-->
-            <!--c () {-->
-                <!--this.model1 = 'hangzhou'-->
-            <!--}-->
-        <!--}-->
-    <!--}-->
-<!--</script>-->
-
-
-<!--<template>-->
-    <!--<div>-->
-        <!--<i-select v-model="model5" disabled style="width:200px">-->
-            <!--<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>-->
-        <!--</i-select>-->
-        <!--<i-select v-model="model6" style="width:200px">-->
-            <!--<i-option value="beijing">北京市</i-option>-->
-            <!--<i-option value="shanghai" disabled>上海市</i-option>-->
-            <!--<i-option value="shenzhen">深圳市</i-option>-->
-        <!--</i-select>-->
-    <!--</div>-->
-<!--</template>-->
-<!--<script>-->
-    <!--export default {-->
-        <!--data () {-->
-            <!--return {-->
-                <!--cityList: [-->
-                    <!--{-->
-                        <!--value: 'beijing',-->
-                        <!--label: '北京市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'shanghai',-->
-                        <!--label: '上海市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'shenzhen',-->
-                        <!--label: '深圳市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'hangzhou',-->
-                        <!--label: '杭州市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'nanjing',-->
-                        <!--label: '南京市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'chongqing',-->
-                        <!--label: '重庆市'-->
-                    <!--}-->
-                <!--],-->
-                <!--model5: '',-->
-                <!--model6: ''-->
-            <!--}-->
-        <!--}-->
-    <!--}-->
-<!--</script>-->
-
-
-
-<!--<template>-->
-    <!--<div>-->
-        <!--<i-select v-model="model7" style="width:200px">-->
-            <!--<Option-group label="热门城市">-->
-                <!--<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>-->
-            <!--</Option-group>-->
-            <!--<Option-group label="其它城市">-->
-                <!--<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>-->
-            <!--</Option-group>-->
-        <!--</i-select>-->
-    <!--</div>-->
-<!--</template>-->
-<!--<script>-->
-    <!--export default {-->
-        <!--data () {-->
-            <!--return {-->
-                <!--cityList: [-->
-                    <!--{-->
-                        <!--value: 'beijing',-->
-                        <!--label: '北京市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'shanghai',-->
-                        <!--label: '上海市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'shenzhen',-->
-                        <!--label: '深圳市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'hangzhou',-->
-                        <!--label: '杭州市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'nanjing',-->
-                        <!--label: '南京市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'chongqing',-->
-                        <!--label: '重庆市'-->
-                    <!--}-->
-                <!--],-->
-                <!--model7: ''-->
-            <!--}-->
-        <!--}-->
-    <!--}-->
-<!--</script>-->
-
-<!--<template>-->
-    <!--<div>-->
-        <!--<i-select v-model="model10" multiple style="width:260px">-->
-            <!--<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>-->
-        <!--</i-select>-->
-    <!--</div>-->
-<!--</template>-->
-<!--<script>-->
-    <!--export default {-->
-        <!--data () {-->
-            <!--return {-->
-                <!--cityList: [-->
-                    <!--{-->
-                        <!--value: 'beijing',-->
-                        <!--label: '北京市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'shanghai',-->
-                        <!--label: '上海市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'shenzhen',-->
-                        <!--label: '深圳市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'hangzhou',-->
-                        <!--label: '杭州市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'nanjing',-->
-                        <!--label: '南京市'-->
-                    <!--},-->
-                    <!--{-->
-                        <!--value: 'chongqing',-->
-                        <!--label: '重庆市'-->
-                    <!--}-->
-                <!--],-->
-                <!--model10: []-->
-            <!--}-->
-        <!--}-->
-    <!--}-->
-<!--</script>-->
-
 <template>
-    <div style="margin: 1000px 0 0 ">
-        <Select v-model="model1" style="width:200px">
+    <Row>
+        <i-col span="12" style="padding-right:10px">
+        <Select v-model="model11" filterable>
             <Option v-for="item in cityList" :value="item.value" :key="item">{{ item.label }}</Option>
         </Select>
-        {{ model1 }}
-        <Button @click="set">set</Button>
-        <Button @click="add">add</Button>
-        <Button @click="remove">remove</Button>
-    </div>
+        </i-col>
+        <i-col span="12">
+        <Select v-model="model12" filterable multiple>
+            <Option v-for="item in cityList" :value="item.value" :key="item">{{ item.label }}</Option>
+        </Select>
+        </i-col>
+    </Row>
 </template>
 <script>
     export default {
@@ -218,26 +28,22 @@
                     {
                         value: 'shenzhen',
                         label: '深圳市'
+                    },
+                    {
+                        value: 'hangzhou',
+                        label: '杭州市'
+                    },
+                    {
+                        value: 'nanjing',
+                        label: '南京市'
+                    },
+                    {
+                        value: 'chongqing',
+                        label: '重庆市'
                     }
                 ],
-                model1: ''
-            }
-        },
-        methods: {
-            clear(){
-                this.d = [];
-            },
-            set () {
-                this.model1 = 'shenzhen';
-            },
-            add () {
-                this.cityList.push({
-                    value: 'chongqing',
-                    label: '重庆市'
-                });
-            },
-            remove () {
-                this.cityList.splice(0, 1);
+                model11: '',
+                model12: []
             }
         }
     }
diff --git a/src/components/select/select.vue b/src/components/select/select.vue
index 784f4e0..38c5759 100644
--- a/src/components/select/select.vue
+++ b/src/components/select/select.vue
@@ -506,6 +506,14 @@
                         }
                     });
                 }
+            },
+            broadcastQuery (val) {
+                if (findComponentDownward(this, 'OptionGroup')) {
+                    this.broadcast('OptionGroup', 'on-query-change', val);
+                    this.broadcast('iOption', 'on-query-change', val);
+                } else {
+                    this.broadcast('iOption', 'on-query-change', val);
+                }
             }
         },
         mounted () {
@@ -579,13 +587,21 @@
             },
             visible (val) {
                 if (val) {
-                    if (this.multiple && this.filterable) {
-                        this.$refs.input.focus();
+                    if (this.filterable) {
+                        if (this.multiple) {
+                            this.$refs.input.focus();
+                        } else {
+                            this.$refs.input.select();
+                        }
                     }
                     this.broadcast('Drop', 'on-update-popper');
                 } else {
                     if (this.filterable) {
                         this.$refs.input.blur();
+                        // #566 reset options visible
+                        setTimeout(() => {
+                            this.broadcastQuery('');
+                        }, 300);
                     }
                     this.broadcast('Drop', 'on-destroy-popper');
                 }
@@ -593,12 +609,7 @@
             query (val) {
                 this.$emit('on-query-change', val);
 
-                if (findComponentDownward(this, 'OptionGroup')) {
-                    this.broadcast('OptionGroup', 'on-query-change', val);
-                    this.broadcast('iOption', 'on-query-change', val);
-                } else {
-                    this.broadcast('iOption', 'on-query-change', val);
-                }
+                this.broadcastQuery(val);
                 
                 let is_hidden = true;
 
--
libgit2 0.21.4