一、html中

1. 静态
   给对应option元素直接添加selected属性

   <select> 
   	<option value="0">one</option> 
   	<option value="1">two</option> 
   	<option value="2" selected>three</option> 
   </select>
   

2. 动态
   option加载完成后给对应元素添加selected属性

   $("option")[2].prop("selected","selected");
   

二、vue中

1. 选中第一项同时并改变select绑定的value（正常业务）

   <template>
   	<select v-model="value"> 
   		<option value="0">New York</option> 
   		<option value="1">London</option>
   		<option value="2">Sydney</option>
   		<option value="3">Ottawa</option>
   	</select>
   </template>
   export default {
   	data () {
       	return {
       		value: '0'	
       	}
       }
   }
   

2. 可模糊匹配，select输入模糊匹配，默认选中下拉选项中第一项，但select绑定的value不变，即下图所示：
   
   我的做法是：

   1. 输入值改变时，监听change事件引起下拉选项的发生改变
      

   2. 判断筛选后的下拉选项Dom元素中没有选中项，为第一项New York添加选中样式；若有选中项则不操作
      

   3. 监听回车事件，如此时有回车事件，判断下拉选项Dom中第一项有选中样式则将value的值变更为选项中第一项的值，即this.value = ‘New York’，并将下拉选项框隐藏
      

   4. 我的实际列子是使用iviewUI中的AutoComplete组件做的（简单举个例子，只提供参考）

      <template>
        <div id="search-input-component">
          <AutoComplete
            v-model="value"
            type="text"
            @keydown.enter.native.prevent="enterEvent"
            @on-change="change"
          >
            <Option
              v-for="item in changeList"
              :value="item.value"
              :key="item.value"
            >
              {{item.name}}
            </Option>
          </AutoComplete>
        </div>
      </template>
      <script>
      export default {
        data () {
          return {
            value: '', // AutoComplete绑定的值
            valueLists: [
              // { value: '选项值', name: '选项名' }
            ], // 全部拉选项列表
            changeList: [] // 实时模糊匹配的下拉选项列表
          }
        },
        created () {
          this.getAllList()
        },
        methods: {
          // 获取所有下拉选项
          getAllList () {
            // ...Data
            this.valueLists = Data
            this.changeList = Data
          },
          // 输入change事件
          change (val) {
            // 模糊匹配逻辑,重新生成下拉选项列表
            this.changeList = []
            this.valueLists.map(item => {
              if (item.toUpperCase().indexOf(val.toUpperCase()) !== -1) {
                this.changeList.push(item)
              }
            })
            this.$nextTick(() => {
              // 下拉框中所有选项的Dom
              const ele = document.querySelectorAll('#search-input-component .ivu-select-dropdown.ivu-auto-complete .ivu-select-dropdown-list .ivu-select-item')
              let hasFocus = false // 初始赋值没有选中项
              for(let i=0; i < ele.length; i++) {
                // 判断有选中项
                if (ele[i].className.indexOf('ivu-select-item-focus') > -1) {
                  hasFocus = true
                  break
                }
              }
              // 判断没有选中项，则选中第一项（添加选中样式）
              if (!hasFocus && (ele[0].className.indexOf('ivu-select-item-focus') === -1)) {
                ele[0].classList += ' ivu-select-item-focus'
              }
            })
          },
          // 回车事件
          enterEvent (card, isUpdate) {
            const selectDom = document.querySelector('#search-input-component .ivu-select-dropdown.ivu-auto-complete')
            // 下拉选项有匹配到数据 并且 下拉选项没有隐藏
            if (this.changeList.length && !selectDom.style.display) {
              // 下拉框中所有选项的Dom
              const items = document.querySelectorAll('#search-input-component .ivu-select-dropdown.ivu-auto-complete .ivu-select-dropdown-list .ivu-select-item')
              let hasFocus = false // 初始赋值没有选中项
              for(let i=0; i < items.length; i++) {
                // 判断有选中项
                if (items[i].className.indexOf('ivu-select-item-focus') > -1) {
                  hasFocus = true
                  break
                }
              }
              // 判断没有选中项，则选中第一项
              if (!hasFocus) {
                this.value = this.changeList[0].cardId
              }
              selectDom.style.display = 'none' // 隐藏下拉框
            }
          }
        }
      }
      </script>