我使用 jquery 移动面板,我想在按“#browsea”后使用 toggleClass 函数在“.ui-block-b”处添加类“ui-block-bw”,它的工作原理如下:
第一次点击 -> 切换 第二次点击 -> 没有 第三次点击 -> 切换
<div data-role="panel" id="browse" data-position="left" data-display="push">
<!-- panel content goes here -->
</div><!-- /panel -->
<div class="ui-grid-d header-grid">
<div class="ui-block-a"><div class="ui-bar ui-bar-e"><img src="img/logo.png" id="logo" /></div></div>
<div class="ui-block-b"><div class="ui-bar ui-bar-e"><a href="#browse" data-role="none" id="browsea"><img class="menu-sprite" src="img/pixel.png" alt="Browse" />Browse</a></div></div>
<div class="ui-block-c"><div class="ui-bar ui-bar-e"><a href="#browse" data-role="none" id="usera"><img class="user-sprite" src="img/pixel.png" alt="User" /></a></div></div>
<div class="ui-block-d"><div class="ui-bar ui-bar-e"><a href="#browse" data-role="none" id="searcha"><img class="search-sprite" src="img/pixel.png" alt="Search" /></a></div></div>
<div class="ui-block-e"><div class="ui-bar ui-bar-e"><a href="#carta" data-role="none" id="carta"><img class="cart-sprite" src="img/pixel.png" alt="Cart" /></a></div></div>
</div><!-- /grid-c -->
<script>
jQuery(document).ready(function() {
jQuery('#browsea').click(function(){
jQuery('.ui-block-b').toggleClass('ui-block-b-w');
});
});
</script>