关于select可input

为了使select可输入，测试了许多方式，包括jquery-editable插件等的使用，但都没设置成功，原因暂时没有探究清楚，之后找到了一段代码

<div class="dropdown" style="float: left">
                      <input type="text" class="text" value="0" name="yLow" id="yLow" placeholder="yLow">
                      <select  onchange="this.previousElementSibling.value=this.value; this.previousElementSibling.focus()">
                        <option>50</option>
                        <option>150</option>
                        <option>250</option>
                        <option>350</option>
                      </select>
                    </div>

然后加上css

.dropdown {
        position: relative;
        width: 90px;
      }
      .dropdown select
      {
        width: 100%;
      }
      .dropdown > * {
        box-sizing: border-box;
        height: 35px;
      }
      .dropdown select {
      }
      .dropdown input {
        position: absolute;
        width: calc(100% - 20px);
      }

就可以达到这个效果

webwxgetmsgimg (2).jpg