想知道,如何讓我的代碼適用於多個可摺疊的div,而無需創建相同CSS/JS代碼的其他實例?Collapsable Div腳本。代碼不適用於多個div
到目前爲止,我只設法使其工作1格。我還是JS的新手,我喜歡學習新技術。
我很樂意聽到一些反饋意見。
<input type="button" onclick="growDiv()" value="Read more" id="more-button">
<div id='grow'>
<div class='measuringWrapper'>
<div class="text">Testing Collapse Testing Collapse Testing Collapse Testing Collapse Testing Collapse Testing Collapse v Testing Collapse Testing Collapse</div>
</div>
</div>
JS
function growDiv() {
var growDiv = document.getElementById('grow');
if (growDiv.clientHeight) {
growDiv.style.height = 0;
} else {
var wrapper = document.querySelector('.measuringWrapper');
growDiv.style.height = wrapper.clientHeight + "px";
}
document.getElementById("more-button").value = document.getElementById("more-button").value == 'Read more' ? 'Read less' : 'Read more';
}
這裏是我的jsfiddle
如果你使用'auto',過渡不工作。 – Oriol
@Oriol我想知道爲什麼它不工作。更新在一秒! –