擴大div滾動高度

-1

我需要擴大溢出設置爲通過CSS隱藏的股利。當點擊«展開»時，div的高度被擴展到顯示整個文本所需的高度。要做到這一點，我用這個代碼：擴大div滾動高度

$(".expand").click(function() { 
$('#mainDiv').animate({ 
height: $('#mainDiv').get(0).scrollHeight 
}, 500, function(){ 
$(this).height('auto'); 
}); 
});

這工作與這樣的硬編碼款預期：

<p class="expand">Expand …</p>

現在我想插入這一段動態取決於是否文本在div比合適div更長。如果它小於divs設定的高度，則不需要這一段。所以我試圖通過添加一個函數來實現這一點，因爲代碼現在看起來像這樣：

$(document).ready(function() { 
var height = $('#mainDiv').prop('scrollHeight'); 
if(height>420){ 
$("<p class='expand'>Expand …</p>").insertAfter('#mainDiv'); 
} 
}); 

$(".aufklappen").click(function() { 
$('#hauptTextInhaltReduziert').animate({ 
height: $('#hauptTextInhaltReduziert').get(0).scrollHeight 
}, 500, function(){ 
$(this).height('auto'); 
}); 
});

插入段落好吧。但是：它不起作用，點擊段落時沒有任何反應。

幫助非常感謝。

來源

2016-06-25 Jörg Matter

你可以創建一個jsfiddle。 – frnt

您的代碼不包括DOM更改。使用以下命令：

$(".aufklappen").on("click", function() { 
    ... 
});

來源

2016-06-25 11:08:34 Gerard

使用綁定到容器/體委託的事件處理程序：
試試這個：

$('body').on('click', '.aufklappen', function(){ 
    $('#hauptTextInhaltReduziert').animate({ 
    height: $('#hauptTextInhaltReduziert').get(0).scrollHeight 
    }, 500, function(){ 
    $(this).height('auto'); 
    }); 
});

也就是說，綁定到一個真實存在的那一刻一個元素JS運行（頁面加載時存在主體），並在.on（）的第二個參數中提供一個選擇器。當點擊發生在body元素上時，jQuery檢查它是否應用於匹配.aufklappen選擇器的那個元素的子元素。

來源

2016-06-25 11:10:22

非常感謝Anuj。這個伎倆。你安全了我的一天！ –

很高興幫助:)接受爲正確答案;） –

擴大div滾動高度

回答

相關問題