diff options
Diffstat (limited to 'files/zh-cn')
-rw-r--r-- | files/zh-cn/web/api/htmlelement/click/index.html | 74 |
1 files changed, 46 insertions, 28 deletions
diff --git a/files/zh-cn/web/api/htmlelement/click/index.html b/files/zh-cn/web/api/htmlelement/click/index.html index 3508c013d3..fe742c3eb2 100644 --- a/files/zh-cn/web/api/htmlelement/click/index.html +++ b/files/zh-cn/web/api/htmlelement/click/index.html @@ -1,44 +1,62 @@ --- -title: HTMLElement.click +title: HTMLElement.click() slug: Web/API/HTMLElement/click tags: - - API - - HTML DOM - - HTMLElement +- API +- HTML DOM +- HTMLElement +- Method +- Reference +browser-compat: api.HTMLElement.click translation_of: Web/API/HTMLElement/click --- -<div>{{ APIRef("HTML DOM") }}</div> +<div> + <div>{{ APIRef("HTML DOM") }}</div> +</div> -<p><strong>click</strong> 方法可以用来模拟鼠标左键单击一个元素。</p> +<p>The <code><strong>HTMLElement.click()</strong></code>方法可以用来模拟鼠标左键单击一个元素。</p> -<p>当在支持click方法的元素上使用该方法时(比如{{ HTMLElement("input") }}元素),会触发该元素的 click 事件。该事件会一直向文档树的上层元素冒泡,也会触发它们各自的click事件。但是,冒泡而来的事件会让一个 {{HTMLElement("a")}} 元素像受到真实的鼠标点击一样执行页面的跳转。</p> +<p>当在支持 <code>click()</code> 方法的元素上使用该方法(例如 + {{HTMLElement("input")}}) ,将会产生该元素的一个点击事件。这个事件会冒泡上升到文档树(或事件链)中更高的元素,并触发它们的点击事件。</p> -<h3 id="Syntax" name="Syntax">语法</h3> +<h2 id="Syntax">语法</h2> -<pre class="syntaxbox">element.click() +<pre class="brush: js"><em>element</em>.click()</pre> + +<h2 id="Example">用例</h2> + +<p>当鼠标移动过复选框时模拟一个点击事件:</p> + +<h3 id="HTML">HTML</h3> + +<pre class="brush: html"><form> + <input type="checkbox" id="myCheck" onmouseover="myFunction()" onclick="alert('click event occurred')"> +</form></pre> + +<h3 id="JavaScript">JavaScript</h3> + +<pre class="brush: js">// 当鼠标滑过(mouse-over)执行 myFunction +function myFunction() { + document.getElementById("myCheck").click(); +} </pre> -<h3 id="Specification" name="Specification">规范</h3> +<h2 id="Specifications">规范</h2> -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('DOM2 HTML', 'html.html#ID-2651361')}}</td> - <td>{{Spec2('DOM2 HTML')}}</td> - <td>Initial definition</td> - </tr> - </tbody> -</table> +{{Specifications}} -<h2 id="浏览器兼容性">浏览器兼容性</h2> +<h2 id="Browser_compatibility">浏览器兼容性</h2> +<p>{{Compat}}</p> +<h2 id="See_also">参见</h2> -<p>{{Compat("api.HTMLElement.click")}}</p> +<ul> + <li>有关的事件处理 + <ul> + <li>{{domxref("GlobalEventHandlers.onclick")}}</li> + <li>{{domxref("GlobalEventHandlers.ondblclick")}}</li> + <li>{{domxref("GlobalEventHandlers.onauxclick")}}</li> + </ul> + </li> +</ul> |