JQuery/PHP
JQUERY实现网站导航点击链接不跳转只展开/收缩二级菜单
PetitQ
收藏
制作手机网站时，网站导航有时会有二级菜单，当某个栏目有二级菜单时，点击父超链接不跳转，只展开/收缩二级菜单。
默认情况下，只要我们点击了超链接就会跳转，如果想让点击链接不跳转只展开/收缩二级菜单，就需要使用 JQUERY 来控制。
也想出现在这里？联系我们吧
实现效果如下：
实现方法比较简单，只要将下面的 JQUERY 代码放在导航代码下方即可。
<script>
$(".navlist>li.menu-item-has-children>a").click(
function(){
$(this).attr("href","#");
$(this).next("ul").slideToggle();
});
</script>
如果要 PC 站导航是移动显示二级菜单，手机站是点击展开，可以用下面的代码：
<?php if (is_mobile() ): ?>
<script>
$(".navlist>li.menu-item-has-children>a").click(
function(){
$(this).attr("href","#");
$(this).next("ul").slideToggle();
});
</script>
<?php else: ?>
<script>
$(".navlist>li").hover(function () {
$(this).children("ul").show()
}, function () {
$(this).children("ul").hide()
});
</script>
<?php endif ;?>
通过 PHP 判断是不是手机站，从而加载不同的 JQUERY 代码，实现不同的功能需求。
专业提供WordPress主题安装、深度汉化、加速优化等各类网站建设服务，详询在线客服！
也想出现在这里？联系我们吧
