責任連鎖モードはjavascript事件を模擬して泡が発生します.

10392 ワード

責任連鎖のモードの中で、多くの対象はそれぞれの対象からその下の家に対する引用によって連結して一つの鎖を形成します.この要求は、チェーン上のあるオブジェクトがこの要求を処理することを決定し、転送を終了するまで、このチェーン上で伝達される.
javascript事件の泡が立つ:
IEイベントは、最も近いイベント発生座標のhtml要素によって開始され、イベントが阻止されていない場合、イベントは、その定義に従って継承された各親ノードとともにDOMノード全体のレベルを横断する.
        FFはまず、IEと反対方向のイベントフローを作り、catchがなければ、IEと同じ方向のイベントフローをもう一つ作る.
 
上からは、事件の泡視が責任連鎖モードの一種の表現であることが分かりますので、下記のコードテストを行いました.
1.チェーン上の各要素に対して一つのインターフェースを抽象化する:
 
package com.sail.utils.htmlEventFlow.dom;

import com.sail.utils.htmlEventFlow.event.JsEvent;

/**
 *   dom     
 * @author wjs
 *
 */
public interface Dom {

	//    dom     
	String getTagName();
	
	//    dom  
	Dom getParent();
	
	//    
	void flowEvent(JsEvent event, Dom dom);
	
	//    
	void catchEvent(JsEvent event);
	
	//    
	boolean stopEvent();
}
 2.一般的なHTMLタイプDomを作成するテンプレート抽象父類
 
package com.sail.utils.htmlEventFlow.dom;

import com.sail.utils.htmlEventFlow.event.JsEvent;

/**
 * HTML  Dom  
 * @author wjs
 *
 */
public abstract class DomHtml implements Dom {
	
	//html  ID
	private String id;
	//html    
	private String tagName;
	//html  js    
	private String eventFuntion="";

	/**
	 *   
	 * @event   
	 * @dom dom         
	 */
	public void flowEvent(JsEvent event, Dom dom) {
		//    
		System.out.println(this.getTagName()+"     "+event.getType());
		//       
		this.catchEvent(event);
		//      
		if(stopEvent())
			return ;
		//  dom 
		dom.flowEvent(event, this);
		
		//    ,   
		System.out.println(this.getTagName()+"     "+event.getType()+"    ");
		this.catchEvent(event);
		if(stopEvent())
			return ;
	}

	public abstract Dom getParent() ;
	
	/**
	 *         
	 */
	public void catchEvent(JsEvent event) {
		if(this.eventFuntion==null || this.eventFuntion.trim().equals(""))
			System.out.println(this.getTagName()+"      "+event.getType()+"     !");
		else{
			System.out.println(this.getTagName()+"     "+event.getType()+"       :");
			System.out.println(this.eventFuntion);
			System.out.println("------------------------    --------------------");
		}
	}

	/**
	 *     
	 */
	public boolean stopEvent() {
		if(this.eventFuntion!=null && this.eventFuntion.indexOf("stopPropagation()")!=-1){
			System.out.println("--------------       --------");
			return true;
		}
		System.out.println(this.getTagName()+"        ");
		return false;
	}
	
	public String getEventFuntion() {
		return eventFuntion;
	}

	public void setEventFuntion(String eventFuntion) {
		this.eventFuntion = eventFuntion;
	}

	public String getId() {
		return id;
	}

	public void setId(String id) {
		this.id = id;
	}

	public void setTagName(String tagName) {
		this.tagName = tagName;
	}
	
	public String getTagName(){
		return this.tagName;
	}

}
 4.各種のhtml元素を生成する
 
package com.sail.utils.htmlEventFlow.dom;

public class Html extends DomHtml {
	@Override
	public Dom getParent() {
		// TODO Auto-generated method stub
		return null;
	}
}


class Body extends DomHtml {
	@Override
	public Dom getParent() {
		// TODO Auto-generated method stub
		return null;
	}
}

class Table extends DomHtml {
	@Override
	public Dom getParent() {
		// TODO Auto-generated method stub
		return null;
	}
}

class Tr extends DomHtml {
	@Override
	public Dom getParent() {
		// TODO Auto-generated method stub
		return null;
	}
}

class Td extends DomHtml {

	@Override
	public Dom getParent() {
		// TODO Auto-generated method stub
		return null;
	}
}

class Div extends DomHtml {
	@Override
	public void catchEvent(JsEvent event) {
		System.out.println("--------------div        -------------------");
		System.out.println(this.getTagName()+"     "+event.getType()+"        :");
		System.out.println("    ");
		System.out.println("--------------    -------------------");
	}
	public Dom getParent() {
		return null;
	}
}

class Input extends DomHtml {
	@Override
	public Dom getParent() {
		// TODO Auto-generated method stub
		return null;
	}
}
 5.dom元素の容器オブジェクトを生成する
 
package com.sail.utils.htmlEventFlow.dom;

import java.util.ArrayList;
import java.util.List;

import com.sail.utils.htmlEventFlow.event.JsEvent;
/**
 * dom              dom  
 * @author wjs
 *
 */
public class Window extends DomHtml {

	//dom      
	List<Dom> elements=new ArrayList<Dom>();
	
	/**
	 *      dom  
	 * @param dom
	 * @return
	 */
	public Dom nextDom(Dom dom) {
		if(dom == null)
			return null;
		int index=elements.indexOf(dom);
		index++;
		if(index <0 || index>=elements.size())
			return null;
		return elements.get(index);
	}
	
	/**
	 *   
	 * @param dom
	 */
	public void putDom(Dom dom){
		if(dom==null)
			return ;
		this.elements.add(dom);
	}
	
	/**
	 *     dom        ,               
	 */
	@Override
	public void flowEvent(JsEvent event, Dom dom) {
		Dom next=this.nextDom(dom);
		if(next==null){
			System.out.println("      window  ");
			System.out.println();
			return ;
		}
		//       dom      “this”    ,                
		next.flowEvent(event, this);
	}

	@Override
	public Dom getParent() {
		// TODO Auto-generated method stub
		return null;
	}
}
 6.イベントインターフェースの定義
 
package com.sail.utils.htmlEventFlow.event;

import com.sail.utils.htmlEventFlow.dom.Dom;

/**
 *       
 * @author wjs
 *
 */
public interface JsEvent {

	//    
	String getType();
	
	//      
	Dom getTarget();
	
	//      
	void stopPropagation();
}
7.クリックイベントを定義する
package com.sail.utils.htmlEventFlow.event;

import com.sail.utils.htmlEventFlow.dom.Dom;

public class ClickEvent implements JsEvent {
	
	private String type;

	public Dom getTarget() {
		return null;
	}

	public String getType() {
		return this.type;
	}
	
	public void setType(String type) {
		this.type=type;
	}

	public void stopPropagation() {

	}

} 
  8.テストコード
 
package com.sail.utils.htmlEventFlow;

import com.sail.utils.htmlEventFlow.dom.*;
import com.sail.utils.htmlEventFlow.event.ClickEvent;


public class FlowEvent {

	public static void main(String[] args) {
		DomHtml input=new Input();
		input.setTagName("input");
		DomHtml div=new Div();
		div.setTagName("div");
		DomHtml td=new Td();
		td.setTagName("td");
		DomHtml tr=new Tr();
		tr.setTagName("tr");
		DomHtml table=new Table();
		table.setTagName("table");
		DomHtml body=new Body();
		body.setTagName("body");
		DomHtml html=new Html();
		html.setTagName("html");
		Window window=new Window();
		window.setTagName("window");
		String function="alert('   ')";
		table.setEventFuntion(function);
		
		window.putDom(window);
		window.putDom(input);
		window.putDom(div);
		window.putDom(td);
		window.putDom(tr);
		window.putDom(table);
		window.putDom(body);
		window.putDom(html);
		
		ClickEvent event=new ClickEvent();
		event.setType("click");
		
		window.flowEvent(event, window);
	}
}
 9.運転結果
 
inputはclickを行いました.
inputはイベントclickを処理していません.
inputは事件の泡が立つことを阻止していません.
divはclickを行いました
------------div共通事件処理方法-----------
divはイベントclickを以下のように処理します.
ポップアップウィンドウ
--------------処理終了---------------------------------
divは事件の泡が発生することを阻止していません.
tdはclickを行いました
tdイベントclickは未処理です!
tdイベントの泡が発生するのを阻止していません.
trはclickを行いました
trイベントclickは未処理です.
trイベントの泡が発生するのを阻止していません.
テーブルはclickを行いました.
テーブルはイベントclickを以下のように処理します.
alert('こんにちは')
--------------処理終了-------------------
テーブルは事件の泡が立つことを阻止していません.
bodyはclickを行いました.
bodyはイベントclickを処理していません!
bodyは事件の泡が立つことを阻止していません.
)clickを行いました.
htmlイベントclickは未処理です!
)事件の泡が発生するのを阻止していません.
事件はもうwindowの上に現れました.
 
以下のようにdom逆方向jsイベントです.
 
)clickを行ったイベントフロー
htmlイベントclickは未処理です!
)事件の泡が発生するのを阻止していません.
bodyはclickのイベントフローを行いました.
bodyはイベントclickを処理していません!
bodyは事件の泡が立つことを阻止していません.
テーブルはclickのイベントフローを行いました.
テーブルはイベントclickを以下のように処理します.
alert('こんにちは')
--------------処理終了-------------------
テーブルは事件の泡が立つことを阻止していません.
tr clickのイベントフローを行いました.
trイベントclickは未処理です.
trイベントの泡が発生するのを阻止していません.
tdはclickのイベントフローを行いました.
tdイベントclickは未処理です!
tdイベントの泡が発生するのを阻止していません.
divはclickのイベントフローを行いました.
------------div共通事件処理方法-----------
divはイベントclickを以下のように処理します.
ポップアップウィンドウ
--------------処理終了---------------------------------
divは事件の泡が発生することを阻止していません.
inputはclickのイベントフローを行いました.
inputはイベントclickを処理していません.
inputは事件の泡が立つことを阻止していません.