javascript - javascript中的可扩展div

Question

我的可扩展部分工作得很好，但我想知道是否有办法让我的“阅读更多...”链接在单击后消失。我的大部分代码和故障排除都是从这里 (StackOverflow) 获得的，但我就是找不到让它消失的方法。

代码如下:

<p style="text-align: center; font-size:18px; font face=nerislight; color:#009cdc">Test title test title test title</p>

<script type="text/javascript">
function toggleMe(a){
var e=document.getElementById(a);
var i = document.getElementById(a + '_image');
if(!e)return true;
if(e.style.display=="none"){
e.style.display="block"} else {
e.style.display="none"}
return false;
}
</script>

Test copy Test copy Test copy Test copy Test copy Test copy Test copy Test copy Test copy Test copy Test copy Test copy Test copy Test copy Test copy Test copy Test copy </p>

<p style="text-align: center; font-size:14px; font face=nerislight"><a style="cursor:pointer;" onclick="return toggleMe('landworks')">Read more...</a>

<div id="landworks" style="display:none;">Expansion Expansion Expansion Expansion Expansion Expansion Expansion Expansion Expansion Expansion Expansion Expansion Expansion Expansion Expansion Expansion </p>

<strong>More Expansion</strong>Expansion Expansion Expansion Expansion Expansion Expansion Expansion Expansion Expansion Expansion </p>

<p style="text-align: center;">Call to Action</p>

<div class="mk-button-align center"><a href="http://atestpage.com" id="123" class="mk-button dark button-190 light-color  mk-shortcode three-dimension small  ">Contact us today!</a></div>

<style type="text/css">
.button-190 {
            margin-bottom: 0px;
            margin-top: 0px;

    }

    .button-190 {
            background-color:#009cdc;

    }

     .button-190:hover {
            background-color:#0091cd;

    }
    .button-190.three-dimension  {
         box-shadow: 0px 3px 0px 0px #007db0;
    }
    .button-190.three-dimension:active  {
         box-shadow: 0px 1px 0px 0px #007db0;
    } 
</style>
</div>

基本上，我想要这样，如果有人点击“阅读更多...”，它就会消失，看起来像普通的副本。正如它现在所处的那样，在点击“阅读更多”后，它仍然在页面上，在文本中创建了一个奇怪的中断。谁能帮忙？？

PS:我很想把它放到 JSFiddle 中供大家查看，但我不知道怎么做。 JavaScript 新手...

Answer 1

在处理toggleMe 函数之前隐藏“read more”段落:

onclick="this.style.display='none';return toggleMe('landworks')"

您可以在这个 jsfiddle 中看到它与您的代码一起工作:http://jsfiddle.net/p8v9qpdL/