mcDropdown使用方法

最近使用了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="/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=''/>
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

posted @ 2014-11-14 10:15  nik2011  阅读(576)  评论(0编辑  收藏  举报