我有一个像传记这样的字段,其中包含文本,我需要在第一页上显示该字段的一半(部分)文本,然后出现继续阅读链接,单击该链接后,剩余文本将显示在同一页面上
我需要在 HTML 中实现这一点。
谁能帮我?
请注意,这是快速原型设计。如果你使用jquery,你可以获得更好的里程。
<div>
<span> Biography, first half ...</span>
<a href="javascript:showAll('bioSecondHalf')">Continue reading</a>
<span id="bioSecondHalf" style="display:none"> Biography, second half</span>
</div>
<script type="text/javascript">
function showAll(id) {
document.getElementById(id).style.display = "block";
}
</script>
如果您从完整的文本块开始并且需要在客户端执行所有操作:
<div id="biography" style="display:none">
Biography first half
Biography second half
</div>
如果文本块不包含标记 html,那么您可以抓取传记 div 的内容并在页面加载时对其进行操作
<script>
window.onload = function() {
var bioText = document.getElementById("biography").innerHTML;
var bioFirstHalf = bioText.substring(0,bioText.length/2);
var bioSecondHalf = bioText.substring(bioText.length/2);
document.getElementById("biography").innerHTML = bioFirstHalf + " <a href='javascript:showAll(\"bioSecondHalf\")'>Continue reading</a>" + " <span id='bioSecondHalf' style='display:none'>" + bioSecondHalf + "</span>"
}
</script>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)