我正在try 制作一个按钮，这样当用户单击它时，它会在按住鼠标按键的同时更改其样式.如果它在移动浏览器中被touch ，我也希望它以类似的方式改变它的风格.对我来说，看似显而易见的事情是使用css:active伪类，但这不起作用.我试过了:集中注意力，但也不管用.我试过了:悬停，它似乎起作用了，但在我把手指从按钮上拿开后，它保持了原来的风格.所有这些观察都是在iPhone4和Droid2上进行的.
有没有办法在移动浏览器(iPhone、iPad、Android，希望还有其他浏览器)上复制这种效果？目前，我正在做这样的事情:
<style type="text/css">
#testButton {
background: #dddddd;
}
#testButton:active, #testButton.active {
background: #aaaaaa;
}
</style>
...
<button type="button" id="testButton">test</button>
...
<script type='text/javascript' src='http://code.jquery.com/jquery-1.6.1.min.js'></script>
<script type='text/javascript'>
$("*").live("touchstart", function() {
$(this).addClass("active");
}).live("touchend", function() {
$(this).removeClass("active");
});
</script>
:active伪类用于桌面浏览器，active类用于touch 浏览器.
我想知道有没有一种更简单的方法来做这件事，而不涉及Javascript.