1

使用下面的代码，我正在使用 JQuery Flip 插件生成翻转效果。在“verso”属性中，我有一个带有 id 的选择菜单#ddlBookletType。该 ID 用于触发另一个创建下拉菜单的 JQuery 插件。

我拥有 html（位于 verso 属性中）的方式正在破坏下拉插件。如果我删除翻转功能，那么我的下拉菜单将起作用。

问题：

我能做些什么来确保在仍然使用翻盖插件的同时，我不会破坏翻盖插件内部使用的下拉插件，该插件带有 id ddlBookletType？

代码：

<script type="text/javascript">
        function allflip() {
            flip();
            flip2();
        }
        function flip2() {
            $("#fb_flip").on("click", function (e) {
                $(".flip_stuff").flippy({
                    color_target: "transparent",
                    direction: "top",
                    duration: "750",
                    verso: "<select id='ddlBookletType'>" +
                    "<option value='<%=(int)Booklet.BookletTypeEnum.EventOne %>'>" +
                        "<%=Booklet.BookletTypeEnum.EventOne.GetDescription() %></option>" +
                    "<option value='<%=(int)Booklet.BookletTypeEnum.EventTwo %>'>" +
                        "<%=Booklet.BookletTypeEnum.EventTwo.GetDescription()%></option>" +
                    "<option value='<%=(int)Booklet.BookletTypeEnum.EventThree %>'>" +
                        "<%=Booklet.BookletTypeEnum.EventThree.GetDescription()%></option>" +
                    "<option value='<%=(int)Booklet.BookletTypeEnum.EventFour %>'>" +
                        "<%=Booklet.BookletTypeEnum.EventFour.GetDescription()%></option>" +
                    "<option value='<%=(int)Booklet.BookletTypeEnum.EventFive %>'>" +
                        "<%=Booklet.BookletTypeEnum.EventFive.GetDescription()%></option>" +
                "</select>",
                    onFinish: function () {

                        $("#back").on("click", function (e) {
                            $(".flip_stuff").flippyReverse();
                            setTimeout(function () {
                                allflip();
                            }, 1000);
                        });
                    }
                });
                e.preventDefault();
            });
        }
        $(document).ready(function () { flip2(); });
    </script>

    <script type="text/javascript">
        $("#back").on("click", function (e) {
            $(".flip_stuff").flippyReverse();
        });
    </script>
4

1 回答 1

1

尝试将您的代码包装在这样的闭包周围。您可能正在破坏全局命名空间。

(function () {
  var flip = function () {
    ...
  };
}());
于 2013-09-05T15:33:25.807 回答