javascript - Javascript 代码(显示更多 - 显示更少)

Question

我有一个代码可以显示我的数据库中的数据(传记)，但我正在努力将它组合在一起，因此非常感谢任何帮助。

我想做的是让我的页面只显示简历上的 500 个字符，然后当您单击“显示更多部分”时，它将最大限度地扩展内容字符。我还需要扩展显示我的内容的框。现在，当单击“显示更多”时，我得到了两次完全相同的文本，但没有从我的数据库中得到其余的文本。谢谢大家的帮助，这是我的代码:

<h5>About:</h5>  
    <script type="text/javascript" language="JavaScript"><!--
    function HideContent(d) {
    document.getElementById(d).style.display = "none";
    }
    function ShowContent(d) {
    document.getElementById(d).style.display = "list-item";
    }
    function ReverseDisplay(d) {
    if(document.getElementById(d).style.display == "none") { document.getElementById(d).style.display = "block"; }
    else { document.getElementById(d).style.display = "none"; }
    }
    //--></script><p><?php echo $row->biography; ?><a href="javascript:ShowContent('uniquename')" backgorund="orange">
    ...show more
    </a></p><br/>
    <a href="javascript:ShowContent('uniquename')" backgorund="orange">

    </a>
    <div id="uniquename" style="display:none;">
    <p><?php echo $row->biography; ?></p>
    <a href="javascript:HideContent('uniquename')">
    show less
    </a>
    </div>

Answer 1

当您显示所有内容时，您还应该隐藏第一个内容:

<a href="javascript:ShowContent('uniquename'); this.style.display = 'none'">
Show more....
</a>

它的主要区别是在单击 show more 时添加 this.style.display = "none"。

也可以使用onclick事件来实现这一点