javascript - 如何将按钮置于按下状态？

Question

假设我有一个按钮，当有人点击它时，但在释放鼠标之前，它会进入按下状态。

现在假设有人按下“a”键，我希望按钮进入按下状态，直到释放键，此时它被触发。这可能吗？

Answer 1

在这里做了一些研究后，我得到了最终答案:

您可以使用 keyup 和 keydown 在按钮元素上触发 mousedown 或 mouseup 事件如果您的按钮被编程为根据这些事件更改其样式，那么您就可以开始了。

参见这个 fiddle 示例:http://jsfiddle.net/FwKEQ/15/

请注意，如果您使用 jQuery 的 UI 组件，它就可以正常工作。但是对于标准按钮，您无法使用 javascript 将它们移动到按下状态

html:

<button id="jQbutton">Press 'A' to move me to pressed state</button>

Javascript:

<script>
    $( "#jQbutton" ).button();

    $(document).keydown(function(event) {
        if ((event.keyCode === 97)||(event.keyCode === 65))
            $("#jQbutton").mousedown();
    });

    $(document).keyup(function(event) {
        if ((event.keyCode === 97)||(event.keyCode === 65))
            $("#jQbutton").mouseup();
    });
</script>

编辑:

我们可能会利用一些 hack:使用 accesskey 作为按钮元素，然后尝试模拟 accesskey 按下(我不确定是否可能)这是我目前所在的位置http://jsfiddle.net/FwKEQ/28/

编辑 2:因此，进一步研究该主题后，我发现了以下内容:

1. 默认按钮(无样式)由操作系统呈现，我无法找到正式证明，但如果您尝试使用 mac OS 加载同一页面，您将获得 mac OS 样式按钮而在 Windows 中，您将看到“丑陋”的灰色按钮。

2. 因为默认按钮由操作系统呈现，所以它们符合操作系统事件，即浏览器发送的可信事件。

3. 自定义样式的按钮并非如此，因为它们符合 CSS 和 JS 以更改其在按下时的外观，这就是 JQ 按钮受 JS 影响的原因。

总而言之，您需要一个受信任的按下事件来触发默认按钮以更改其样式，但由于安全限制而无法完成。

在这里阅读更多关于可信事件的信息:http://www.w3.org/TR/DOM-Level-3-Events/#trusted-events

如果有人可以找到关于操作系统呈现的默认按钮的正式引用，请评论或编辑此答案。