如何设置jquery按钮活动状态

我有这个使用jquery按钮的正确导航。 如果用户单击它，页面将加载。 我需要的是一旦页面重新加载，按钮应显示它已被选中。

如何使用jquery按钮执行此操作？

Answer 1

为什么不使用jQuery UI Tab小部件？ 您还可以尝试使用buttonset小部件吗？

如果这些对您来说不是最佳选择，那么您可以使用一些CSS优势。 以下代码设置了两个jQuery UI按钮，这些按钮在单击时保持其活动状态，从另一个中删除活动状态，并更新已单击的div。

HTML

Button 1 Button 2 
Init.... 

JavaScript的

 $(function() { //Variable of previously selected var selected = []; //Setup Buttons $('.nav').button().click(function() { //Enable previous if(selected[0]) { selected.button('enable').removeClass('ui-state-active ui-state-hover'); } //Cache the previous selected = $(this); //Disable this and keep color attributes selected.button('disable').addClass('ui-state-active').removeClass('ui-state-disabled'); //Do Normal Button Click Stuff Here $('#data').text(selected.text() + ' was clicked'); }); $('#btn').click(); }); 

Answer 2

 $('#mybutton').button().bind('click', function(){ $(this).addClass('ui-state-focus'); }); 

这使它保持聚焦状态（即，根据您选择的jquery ui主题突出显示）。 当然，您需要从工具栏上的所有其他按钮中删除此类。

Answer 3

如果您的按钮转到新页面，则需要使用服务器端语言或html（取决于您的设置）来切换类。

如果您的按钮使用新内容刷新当前页面，则可以使用以下内容：

 .active { font-weight:bold; } $('#button').addClass('active'); 

Answer 4

页面加载后，将一个css类添加到按钮。 为此类提供一些样式，表明它已被选中。