关于下拉列表为展开状态的控制

    在CSDN发表第一篇博客，想谈谈最近遇到的问题！

    最近一直搞公司版块，但是，程序那边的一个师兄，突然叫我试着搞一些tooltip和div模仿下拉列表之类的小工具。于是，我就开始忙了起来，虽然，这些都不是什么难题，不过，要做，还是要做个好的，而且简单的。于是我上网搜索了一下，先说说下拉列表的问题吧，这个东西的样子大概就是下面这样。

    当我在这个input里面输入的时候，就会出现

abcd-01abcd-02abcd-03

    而且显示的内容要和输入内容匹配，并且select是要展开的，我觉得这样会比做一个DIV出来要方便，毕竟是一个表单，传参传值都似乎比较容易。

    但是上网搜了很久，都找不到一个合适的，主要是要select为展开状态这里比较难一点，有些是教我们把select的size属性定死，好象我有3个option，就把size定为3这样，虽然这样能解决，但是，如果我的option是不定的呢？这样就不行了。又看到有人把select的mutiple属性定出来，就是把select定性为多选列表，这样也不合要求，不过的确能把select定为展开状态。一个自己找出来的延伸的方法，虽然后来证实不行，不过也说说，听说过css和js之间的交互，不但能用js访问css，控制css，调过来，css也可以控制和访问js，接口就是expression，可是后来发现，第一，expression似乎会很耗资源，第二，expression好象在ff里面不支持，第三，在css里面为select定一个size的样式似乎是无效的，size样式只能定为select的属性，并不能作为样式。于是又要继续想。

    后来，我终于不耐烦了，结果最后就用了一段js来控制，原理就是获取DOM里面select元素的option项的数目，然后把size属性的数值定为这个数目就OK了，似乎不难，但是，在网上的确找了很久都没找到合适的，不管了，自己发一发，可能会帮到其他有需要的人。

    如果有高手看见这篇文章，觉得我的观点不对，希望帮忙纠正，我也可以从中学习，谢谢...

    下面是用来控制select为展开状态的html和js：

    HTML：

    <input id="input1" onkeypress="openList(this)" />

    <select id="select1">

        <option>option1</option>

        <option>option2</option>

        <option>option3</option>

        <option>option4</option>

    </select>

    JS：

    /*-以下就是用于控制select为展开状态，并且把不需要使用滚动条，size属性自动与列表项数匹配--*/

    var select1  = document.getElementById("select1");

    select1.size = select1.options.length;

    function openList(obj) {

        /* 这里就是控制input和select之间打交道的代码了，这个跟这篇文章问题没多大关系，所以就省略了 */

    }