小编roc*_*dew的帖子

使用jQuery触发自定义下拉列表

最终,我想在单击图像时切换选择下拉列表.我想利用自定义jQuery库中定义的"打开/关闭"功能,但无法弄清楚如何访问"打开"功能.

问题:如何访问自定义jQuery库中定义的"打开"或"关闭"函数？(更多细节如下 - 请注意,我没有使用jQuery Prototypes的经验,这是这个问题的一个重要部分 - 我甚至不确定我是否可以正确访问该对象.)

任何帮助/建议或指导表示赞赏

我正在使用Codrops Simple Effects for Dropdowns文章作为参考.

具体来说,我在我的示例/问题中引用了演示#4.

该示例使用自定义jQuery库来设置样式/动画下拉列表:

这是代码仓库(SimpleDropDownEffects)
这是原始代码(jquery.dropdown.js)

这很简单:

首先,您将布置HTML"选择"(下拉)标记

<select id="cd-dropdown" class="cd-select">
    <option value="-1" selected>Choose an animal</option>
    <option value="1" class="icon-monkey">Monkey</option>
    <option value="2" class="icon-bear">Bear</option>
    <option value="3" class="icon-squirrel">Squirrel</option>
    <option value="4" class="icon-elephant">Elephant</option>
</select>

Run Code Online (Sandbox Code Playgroud)

(包括所有必要的项目文件后)您可以调用您的插件功能
```
$( '#cd-dropdown' ).dropdown();
```
Run Code Online (Sandbox Code Playgroud)

然后,该函数将我们的"选择"标记转换为以下结构

<div class="cd-dropdown">
    <span>Choose an animal</span>
    <input type="hidden" name="cd-dropdown">
    <ul>
        <li data-value="1"><span class="icon-monkey">Monkey</span></li>
        <li data-value="2"><span class="icon-bear">Bear</span></li>
        <li data-value="3"><span class="icon-squirrel">Squirrel</span></li>
        <li data-value="4"><span class="icon-elephant">Elephant</span></li>
    </ul>
</div>

Run Code Online (Sandbox Code Playgroud)