使用“SELECT”下拉列表动态展开和缩小div边框

Question

单击“SELECT”类型下拉列表时，如何实现边框“扩展/收缩”效果以及边框。

Answer 1

这样的事情：

<div id="borderfx">&nbsp;</div>

<script type="text/javascript">
    function changeBorder() {
       document.getElementById('borderfx').style.borderStyle = this.options[this.selectedIndex].value;
    }
</script>

<select onchange="changeBorder()">
   <option value="solid">Solid</option>
   <option value="dashed">Dashed</option>
   <option value="dotted">Dotted</option>
</select>