DOM例子之setCapture与事件预览

DOM事件捕获实例

最新推荐文章于 2025-01-29 20:33:26 发布

原创最新推荐文章于 2025-01-29 20:33:26 发布 · 886 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#button #浏览器

EXT/GWT 专栏收录该内容

7 篇文章

订阅专栏

本文通过一个具体的DOM操作示例，展示了如何使用按钮捕获所有鼠标事件，并介绍了一个无法响应点击事件的按钮和一个捕获所有事件的按钮的实现方式。

/**
	 * DOM的例子
	 * <pre>
	 * 界面上的所有鼠标事件都被按钮captureButton所捕获了
	 * </pre>
	 */
	private void toDOM(){
		Button noEventButton = new Button("无法点击的按钮");
		noEventButton.addClickHandler(new ClickHandler() {
			
			@Override
			public void onClick(ClickEvent event) {
				Window.alert("看不到的信息");
			}
		});
		
		Button captureButton = new Button("捕获鼠标的按钮");
		captureButton.addClickHandler(new ClickHandler() {
			
			@Override
			public void onClick(ClickEvent event) {
				Button captureButton = (Button)event.getSource();
				Window.alert("都被我捕获了");
				DOM.setCapture(captureButton.getElement());
			}
		});
		//DOM.setCapture在捕获到一次消息后就会失效
		//因此在当事件触发后，需要再次调用DOM.setCapture
		DOM.setCapture(captureButton.getElement());
		
		RootPanel.get().add(noEventButton);
		RootPanel.get().add(captureButton);
		
		//浏览器的所有事件都被其捕获。
		Event.addNativePreviewHandler(new NativePreviewHandler() {
			@Override
			public void onPreviewNativeEvent(NativePreviewEvent event) {
				Window.alert("事件预览");
			}
		});
	}