:touch CSS 伪类或类似的东西？

我正在尝试制作一个按钮，这样当用户单击它时，它会在按住鼠标按钮的同时更改其样式。如果在移动浏览器中触摸它，我还希望它以类似的方式改变其样式。对我来说，看似显而易见的事情是使用 CSS :active 伪类，但这不起作用。我尝试过：focus，但它也不起作用。我尝试了 :hover，它似乎有效，但在我将手指从按钮上移开后它保持了样式。所有这些观察结果都是在 iPhone 4 和 Droid 2 上进行的。

有没有办法在移动浏览器（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 类适用于触摸浏览器。

我想知道是否有一种更简单的方法来做到这一点，而不涉及 Javascript。

不存在这样的事情:touch在 W3C 规范中，http://www.w3.org/TR/CSS2/selector.html#pseudo-class-selectors

:active我想应该可以。

订购于:active/:hover伪类对于它的正确运行很重要。

这是上面链接的引用

交互式用户代理有时会更改呈现以响应用户操作。 CSS 为常见情况提供了三个伪类：

• :hover 伪类在用户指定元素时应用 （使用一些指点设备），但是 不激活它。例如，视觉 用户代理可以应用这个 当光标（鼠标 指针）悬停在生成的框上 由元素。用户代理不 支持互动媒体不 必须支持这个伪类。 一些符合要求的用户代理支持 互动媒体可能无法 支持这个伪类（例如，一支笔 设备）。
• :active 伪类在元素被激活时应用 用户。例如，之间 用户按下鼠标的次数 按钮并释放它。
• :focus 伪类在元素具有焦点时应用 （接受键盘事件或其他 文本输入的形式）。