选择框可以同时输入和选择选项

<li>
                            <p class="address">校区</p>
                            <div class="addresschoice">
                                <span class="addressel">
                                       <select name="address" onchange="qlcTrainS('cho_adr1')" id="cho_adr1">
                                           <option value="test1">央音校区：西城区闹市口大街9号院3号楼103</option>
                                           <option value="test2">太阳宫校区：朝阳区太阳宫凯德Mall三层07</option>
                                           <option value="test3">长楹天街校区：朝阳区龙湖长楹天街购物中心西区三层34</option>
                                       </select>
                             
                                </span>
                                <span class="addessinp">
                                    <input type="text" name="ccdd" id="cho_adr" class="ccdd" placeholder="输入或选择区域">
                                </span>
                            </div>
                            <span id="" class="errortit">*格式错误</span>
                            <span id="" class="errortit">*不能为空</span>
                        </li>

/*将select的值赋给input框*/
        function qlcTrainS(idName) {
                var arrValue=document.getElementById(idName).options[document.getElementById(idName).selectedIndex].value;
                $("#"+idName+"").parent('span').next('span').children('input.ccdd').val(arrValue);
        }

.addresschoice{
    width: 186px;
    height: 32px;
    position: relative;
    margin-left: 90px;
}
.addrespan{
    position:absolute;
    top:0;
    overflow:hidden;
    width:95%;
    height:32px;
}
#cho_adr1{
    width:100%;
    height:32px;
    outline:0;
    border-radius:8px ;
}
.addessinp{
    position:absolute;
    top:1px;
    left:5px;
    width:80%;
    height:32px;
    border-radius:5px;
}
#cho_adr{
    width:80%;
    height:30px;
    border:0pt;
    border-radius:5px;
    outline:0;
}