移动 Web 应用程序菜单栏中的快速"Tab"切换

Question

我正在尝试为移动Web应用程序提供一个类似本机的标签栏。

我有一个固定的菜单列表，可以更改同一页面上的页面内容，我希望菜单项在点击时立即更改突出显示状态，但在删除先前选择的项目时发现一些滞后。

:active和:focus和.active都具有相同的外观。

我的更改菜单项脚本：

$(".nav li").click(function(e){
    $(".nav li").removeClass("active");
    $(this).addClass("active");
    //do other functions...
})

Answer 1

更快的解决方案是仅在需要的地方删除该类：

$(".nav li").click(function(e){
    $(".nav .active").removeClass("active");
    $(this).addClass("active");
    //do other functions...

}）

一个更快的替代方法（因为它由浏览器处理）是为此使用单选按钮。该解决方案不需要任何脚本。您可以根据需要设置样式。看

CSS技巧解决方案

弘基解决方案