javascript - 使用jQuery后网页跳异常

我正在使用此代码隐藏和显示链接标记下的图像。我将此html代码放在网站的中间。

我的问题是，每当我单击链接标记时，我的网站就会从中间跳到顶部。因此，观看者看不到滑动效果，因此必须再次向下滚动才能回到中间。

如何防止它跳到顶部？我在wordpress中使用它。

HTML：

<a class = "showul" href="#"> 24 hour front desk</a>
<img class = "hideul" src="http://localhost.com/wp-content/uploads/2013/12/recption-300x200.jpg" />

<a class="showul" href="#">Restaurant</a>
<img class="hideul" src="http://localhost.com/wp-content/uploads/2013/12/rest-300x200.jpg" alt="" />

<a class="showul" href="#"> Conference</a>
<img class="hideul" src="http://localhost.com/wp-content/uploads/2013/12/conference-300x200.jpg" alt="" />

JavaScript：

jQuery(document).ready(function($) {
    $(".showul").click(function() {
        var $hideUl = $(this).siblings(".hideul");
        var show = !$hideUl.is(':visible');

        $('.hideul').slideUp('slow');
        if (show)
            $hideUl.slideToggle('slow');
    });
});

最佳答案

将href="#"的所有实例替换为将解决问题的href="javascript:void(0)"