5

我在 asp.net 中制作了一个自定义的可折叠字段集控件。我使用 jquery 添加切换效果。该控件运行良好,但是当我在更新面板中使用我的字段集时,在回发后,由于 document.ready,我失去了我的 jquery 逻辑。

现在我已经阅读了 Jquery 的新 Live() 函数,但我没有让它工作。我做错了什么?有人回答吗??

非常感谢

我的 Jquery 代码是:

$(document).ready(function() {

    $.fn.collapse = function(options) {
        var defaults = { closed: false }
        settings = $.extend({}, defaults, options);

        return this.each(function() {
            var obj = $(this);

            obj.find("legend").addClass('SmartFieldSetCollapsible').live("click", function() {


                if (obj.hasClass('collapsed')) { 
                obj.removeClass('collapsed').addClass('SmartFieldSetCollapsible'); }

                $(this).removeClass('collapsed');

                obj.children().next().toggle("slow", function() {

                    if ($(this).is(":visible")) {

                        obj.find("legend").addClass('SmartFieldSetCollapsible');
                        obj.removeAttr("style");
                        obj.css({ padding: '10px' });
                        obj.find(".imgCollapse").css({ display: 'none' });
                        obj.find(".imgExpand").css({ display: 'inline' });

                    }
                    else {

                        obj.css({ borderLeftColor: 'transparent', borderRightColor: 'transparent', borderBottomColor: 'transparent', borderWidth: '1px 0px 0px 0px', paddingBottom: '0px' });
                        obj.find(".imgExpand").css({ display: 'none' });
                        obj.find(".imgCollapse").css({ display: 'inline' });

                    }
                });
            });

            if (settings.closed) {
                obj.addClass('collapsed').find("legend").addClass('collapsed');
                obj.children().filter("p,img,table,ul,div,span,h1,h2,h3,h4,h5").css('display', 'none');
            }
        });
    };


});


$(document).ready(function() {

$("fieldset.SmartFieldSetCollapsible").collapse();

});
4

3 回答 3

5

问题是您所做的不仅仅是为您的实时选择提供一个简单的选择器

来自api.jquery.com “不完全支持 DOM 遍历方法来查找要发送到 .live() 的元素。相反,应始终在选择后直接调用 .live() 方法”

于 2010-01-31T18:19:29.277 回答
2
            if (obj.hasClass('collapsed')) { 
            obj.removeClass('collapsed').addClass('SmartFieldSetCollapsible'); }

            $(this).removeClass('collapsed');

首先,您要删除该类并添加另一个类(如果该类已折叠),然后您删除该类已折叠。我不知道它是否会影响系统的工作,但值得一试。

如果您只使用 .click (当字段未更新时),该功能是否有效?

于 2010-01-31T18:05:28.760 回答
1

穿越是个问题。您可以通过简单的选择来解决它。

var obj = $(this),
    obj.find("legend").addClass('SmartFieldSetCollapsible');
$('legend.SmartFieldSetCollapsible').live('click.collapsible', function(e){
于 2010-08-18T17:20:29.007 回答