Question

我将div附加到其中一位父母身上。我需要计算儿童的占用面积。为此做循环，找到这样的孩子身高;

this.clippings.children().each(function () {
    console.log($(this).outerHeight());
});

但我总是0所以我决定使用deferred：

$.when(that.clippings.children()).then(function () {
    that.clippings.children().each(function () {
        console.log($(this).outerHeight());
    });
});

但我仍然得到相同的结果。我认为deferred我用错了什么。任何人帮助我？

我的应用代码：

onClipHandle : function (el,pNo,clipIndex) {
            //store selections
            var that = this;
            var avilableClass = el.attr('class').split(' ');
            var requiredClass = avilableClass[avilableClass.length-1];
            var selectedText =  $.trim($('.'+requiredClass).clone().children().remove().end().text());
            var elementClass = $('.'+requiredClass).attr('class');

            var classes = elementClass.replace(/textHighLight /g,'');

            var clipper = clipTemp.clone(false); //cloning

            // console.log(classes);

            clipper.addClass(classes);


            var collectClips = classes.split(' ');


            clipper.find('.text').append(clipIndex);
            var textBox = clipper.find('textarea');
            textBox.text(selectedText);

            setTimeout(function(){
                if($(textBox)[0].scrollHeight > 100 ) {
                    that.scrollHandler(textBox);
                } else {
                    textBox.height($(textBox)[0].scrollHeight);
                }
            },100); //only i am getting the height by delaying!


            clipper.on('click', 'a.clippingbin', function (e) {
                e.preventDefault();
                textBox.slimScroll({destroy:true}); //removing scroll object
                var clip = $(e.currentTarget).parents('.clipping');
                $.event.trigger({type:'delete', clip : clipper, pagenum: pNo, clipIndex:clipIndex});
            });

            //add to side bar


            this.clippings.append(clipper); //appending
            $.event.trigger({type:'clipAppended', clip : clipper, pagenum: pNo, clipIndex:clipIndex }); //triggering
            $.event.trigger({type:'updateDocument',pagenum:pNo});


        }

一旦听到触发器clipappended，我就会回路。

更新

this.clip.each(function(){
                console.log($(this)); //consoles
                console.log($(this).height()); //getting 0
            });

不知道..？

Answer 1

尝试创建一个取所有子高度之和的变量：

var occupiedHeight=0;
this.clippings.children()..each(function(index) { 
occupiedHeight+=$(this).height();
});
alert(occupiedHeight);

我认为应该这样做， here's a Demo fiddle 。

Answer 2

这不是javascript问题，这是因为来自

的css'. i updated my css`

div.clipping{
    clear: both;
    width: 92%;
}

到

div.clipping{
    clear: both;
    **overflow: auto;** - added
    width: 92%;

}

它工作正常。感谢所有......！

无法让孩子们达到身高

2 个答案: