<div class="page"> <a href="#" class="a0">上一页</a> <a href="#" class="a1">1</a> <a href="#" class="a0">2</a> <a href="#" class="a0">3</a> <a href="#" class="a0">4</a> <a href="#" class="a0">下一页</a> <span class="s">转到</span> <input type="text" class="ipt"> <a href="#" class="a2">确定</a> </div>
现在是1的地方class 为a1,我想要实现的效果就是点击2后,2的class变为a1, 1,3,4的变为a0 点击3后,3的class变为a1, 1,2,4的变为a0
这个效果怎么实现,求教,谢谢 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script> $(function(){ $('.page a:gt(0):lt(4)').click(function(){ $('.page a.a1').each(function(index, element) { this.className='a0'; });; this.className='a1'; }); }) </script> <style> </style> </head> <body> <div class="page"> <a href="#" class="a0">上一页</a> <a href="#" class="a1">1</a> <a href="#" class="a0">2</a> <a href="#" class="a0">3</a> <a href="#" class="a0">4</a> <a href="#" class="a0">下一页</a> <span class="s">转到</span> <input type="text" class="ipt"> <a href="#" class="a2">确定</a> </div> </body> </html>
|