最近使用了mcDropdown插件，百度一查，资料较少，只看到了mcDropdown官网的英文说明文档，所以今天就写点，以便以后使用。

第一步：引用jquery库和css

• jQuery v1.2.6 (or higher)*
• jquery.mcdropdown.js Plug-in
• jquery.bgiframe.js Plug-in (Optional; for fixing overlay issues in IE6)
•  <link href="http://www.mamicode.com/Content/css/jquery.mcdropdown.min.css" rel="stylesheet" type="text/css" />

好像我引用一个jQuery 1.8有一个方法不支持，不知为什么。

 第二步：实例化 一个对象

$("#mcdropdown").mcDropdown(list, [options]);

如： $("#txtNewsCategory").mcDropdown("#categorymenu");

txtNewsCategory是一个文本框  <input type="text" id="txtNewsCategory"  disabled="disabled"  value=http://www.mamicode.com/‘‘/>

categorymenu 是一个数据源 格式如下：

<ul id="categorymenu" class="mcdropdown_menu">  <li rel="1">    Arts &amp; Humanities    <ul>      <li rel="2">        Photography        <ul>          <li rel="3">            3D          </li>          <li rel="4">            Digital          </li>        </ul>      </li>      <li rel="5">        History      </li>      <li rel="6">        Literature      </li>    </ul>  </li>  <li rel="7">    Business &amp; Economy  </li>  <li rel="8">    Computers &amp; Internet  </li>  <li rel="9">    Education  </li>  <li rel="11">    Entertainment    <ul>      <li rel="12">        Movies      </li>      <li rel="13">        TV Shows      </li>      <li rel="14">        Music      </li>      <li rel="15">        Humor      </li>    </ul>  </li>  <li rel="10">    Health  </li></ul>

View Code

如果要绑定数据到插件上则需：

var mc= $("#txtNewsCategory").mcDropdown();
mc.setValue($("#hidLevel").val()); //设置下拉列表的值

不知为什么，直接把值绑定到value好像不行？

使用的话大概就是这样了，详情请参考英文文档

http://www.givainc.com/labs/mcdropdown_jquery_plugin.cfm

mcDropdown使用方法