javascript - 第二个显示分区功能不起作用

Question

我正在尝试在点击时使用 show div。但是第一个工作正常，但第二个工作不正常。

 <script type="text/livescript">
    function showDiv() {
      div = document.getElementById('change_pass');
      div.style.display = "block";
    }

function showDiv1() {    
      div = document.getElementById('invite-friend_now');
      div.style.display = "block";
    }
 </script>

并使用链接 onclick :

<a href="#" onclick="javascript:showDiv();">Change Password</a>

<a href="#" onclick="javascript:showDiv1();">Invite Friend</a>

单击“更改密码”后，该分区会正确弹出。但是当我们点击 Invite Friend 链接时，页面转到顶部并且 url 仅显示 www.example.com/#。(....尾随 # only)

Answer 1

您可以传递一些参数以仅使用一个函数。此外，您可以使用 preventDefault() 来防止页面向上滚动:

<script type="text/livescript">
    function showDiv(e, divName) {
      div = document.getElementById(divName);
      div.style.display = "block";
      e.preventDefault();
    }
</script>

<a href="#" onclick="showDiv(event, 'change_pass');">Change Password</a>

<a href="#" onclick="showDiv(event, 'invite-friend_now');">Invite Friend</a>

此外，请检查此 invite-friend_now ID，因为我认为您可能拼错了。