mcDropdown使用方法

标签：style   blog   http   io   color   ar   os   使用   sp   

最近使用了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

mcDropdown使用方法

标签：style   blog   http   io   color   ar   os   使用   sp   

原文地址：http://www.cnblogs.com/nik2011/p/4096581.html