angular色=button是什么意思？
我发现，在Google+项目的页面上，button都是由div制作的，例如：
<div role="button"></div> 我想知道，这仅仅是为了语义，它是否影响div的风格或事件句柄？ 我试图模拟点击与JQuery单击button，但它不起作用。
它告诉可访问性（和其他）软件div的目的是什么。 在这里更多的role属性规范草案 。
是的，这只是语义。 发送click事件到button应该工作。
这个答案的早期版本（早在2011年）说：
…但jQuery的
clickfunction不这样做; 它只会触发事件处理程序，而这些事件处理程序是通过jQuery连接到元素的，而不是以其他方式连接的处理程序。
…并提供了下面的示例代码和输出。
我现在不能复制产出（两年后）。 即使我回到早期版本的jQuery，它们都会触发jQuery处理程序，DOM0处理程序和DOM2处理程序。 顺序不一定是真正的点击和jQuery的clickfunction之间的相同。 我已经尝试过jQuery版本1.4,1.4.1,1.4.2,1.4.3,1.4.4,1.5,1.5.1,1.5.2,1.6以及更新的版本，比如1.7.1,1.8.3， 1.9.1和1.11.3（截至撰写本文时为止的1.x版本）。 我只能得出结论，这是一个浏览器的东西，我不知道我使用的是什么浏览器。 （现在我正在使用Chrome 26和Firefox 20进行testing。）
下面是一个testing，它显示了jQuery的处理程序，DOM0处理程序和DOM2处理程序都是由jQuery的click触发的（截至撰写本文时为止）：
jQuery(function($) { var div; $("<p>").text("jQuery v" + $.fn.jquery).appendTo(document.body); // Hook up a handler *not* using jQuery, in both the DOM0 and DOM2 ways div = document.getElementById("theDiv"); div.onclick = dom0Handler; if (div.addEventListener) { div.addEventListener('click', dom2Handler, false); } else if (div.attachEvent) { div.attachEvent('onclick', dom2Handler); } // Hook up a handler using jQuery $("#theDiv").click(jqueryHandler); // Trigger the click when our button is clicked $("#theButton").click(function() { display("Triggering <code>click</code>:"); $("#theDiv").click(); }); function dom0Handler() { display("DOM0 handler triggered"); } function dom2Handler() { display("DOM2 handler triggered"); } function jqueryHandler() { display("jQuery handler triggered"); } function display(msg) { $("<p>").html(msg).appendTo(document.body); } });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <div id="theDiv">Try clicking this div directly, and using the button to send a click via jQuery's <code>click</code> function.</div> <input type='button' id='theButton' value='Click Me'>
可访问性软件使用role属性来了解divfunction。 有关更多信息，请参阅此页面 。
这只是语义。
build议您使用<button>标签使用原生HTMLbutton。 但是，如果您使用<a>或<div>标签进行自定义控件，则强烈build议使用以下有关role='button'信息。
- 触发响应
如果您正在构build自定义控件，则应该像button一样工作。 如果你点击元素，它应该触发一个响应。 例如，这个响应不改变button的文本，即自定义控件。 如果是，那么它不是一个button。
- 键盘焦点
这些作为button的自定义控件应该可以通过键盘进行切换，也可以通过程序对屏幕阅读器进行调整。
- 可操作性
自定义控件应该实现onclick以及onKeyDown事件。 button可以通过空格键激活。 因此，如果您将angular色添加到自定义控件，则需要自己处理这些事件。 否则，语义失去了意义。 屏幕阅读器用户将尝试使用空格键激活button，但不能。
role='button'的自定义控件的标准语法是
<div role="button" tabindex="0" onclick="click_handler()" onKeyDown="keyhandler_for_space()">
如果您正在使用<a>标记，则tabindex="0"不是必需的，但如果使用不可聚焦标记（如<span>或<div>手动允许焦点，则需要tabindex="0" 。
另一个有用的提示是，如果您仍然使用构build自定义button，那么使用<a>标记会更好，因为您可以避免使用onclick处理程序。
