0

我有一个基本上可以使任何非实时功能成为实时功能的功能

(function($) {
    $.fn.extend({
        collapsiblePanel: function() {
            // Call the ConfigureCollapsiblePanel function for the selected element
            return $(this).each(ConfigureCollapsiblePanel);
        }
    });

})(jQuery);

function ConfigureCollapsiblePanel() {
    $(this).addClass("ui-widget");

    // Wrap the contents of the container within a new div.
    $(this).children().wrapAll("<div class='collapsibleContainerContent ui-widget-content'></div>");

    // Create a new div as the first item within the container.  Put the title of the panel in here.
    $("<div class='collapsibleContainerTitle ui-widget-header'><div>" + $(this).attr("title") + "</div></div>").prependTo($(this));

    // Assign a call to CollapsibleContainerTitleOnClick for the click event of the new title div.
    $(".collapsibleContainerTitle", this).click(CollapsibleContainerTitleOnClick);
}

function CollapsibleContainerTitleOnClick() {
    // The item clicked is the title div... get this parent (the overall container) and toggle the content within it.
    $(".collapsibleContainerContent", $(this).parent()).slideToggle();
}

     (function ($) {
 $.fn.livecollapsiblePanel = function (opts) {
        this.live("mouseover", function() {
            if (!$(this).data("init")) {
                $(this).data("init", true).collapsiblePanel(opts);
            }
        });
        return $();
    };
}(jQuery));
     $(".collapsibleContainer").livecollapsiblePanel();

我主要做的是在 ajax 调用中生成可折叠面板并将其显示在 div 中。为了让我将每个 div '激活'到一个可折叠面板中,我目前需要将鼠标悬停在每个 div 上,然后将其转换为可折叠面板...有什么办法可以将它更改为 div 从 ajax 加载时称它们为可折叠面板。

4

0 回答 0