今天,折腾了一个上午,加下午1个小时,终于实现了zk页面中,如何将javascript代码发送到服务器端。
下面以点击一个button按钮,将button按钮对应的鼠标点击的位置发送到服务器端为例来看这段代码是如何实现数据传输的。
zul页面的代码如下:
<?xml version="1.0" encoding="UTF-8"?> <?taglib uri="/WEB-INF/tld/web/core.dsp.tld" prefix="c" ?> <?taglib uri="/WEB-INF/tld/web/html.dsp.tld" prefix="h" ?> <zk xmlns:h="http://www.w3.org/1999/xhtml"> <script type="text/JavaScript"> <![CDATA[ function pointerX() { return event.pageX || (event.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft)); } function pointerY() { return event.pageY || (event.clientY + (document.documentElement.scrollTop || document.body.scrollTop)); } //获取鼠标位置的函数 function mousePositon() { var x_Px_page = pointerX(); var y_Px_page = pointerY(); return(x_Px_page+","+y_Px_page); } ]]> </script> <window width="100%" height="100%" use="com.cvicse.inforreport.server.Test"> <h:table width="100%" border="0" height="100%"> <h:tr align="center"> <h:td> <button id="buttontest" action="onclick:comm.sendClick(this, mousePositon())"/> </h:td> </h:tr> </h:table> </window> </zk>
java对应的代码:
package com.cvicse.inforreport.server;
import org.zkoss.zk.ui.event.Event;
import org.zkoss.zk.ui.event.EventListener;
import org.zkoss.zk.ui.event.MouseEvent;
import org.zkoss.zk.ui.ext.AfterCompose;
import org.zkoss.zul.Button;
import org.zkoss.zul.Window;
public class Test extends Window implements AfterCompose {
private static final long serialVersionUID = 1L;
private Button buttontest;
public void afterCompose() {
// TODO Auto-generated method stub
buttontest = (Button) this.getFellow("buttontest");
buttontest.addEventListener("onClick", new EventListener() {
public void onEvent(Event event) throws Exception {
// TODO Auto-generated method stub
MouseEvent me = (MouseEvent) event;
//获取从客户端发送过来的数据就放到了me.getArea()中
System.out.println((String) me.getArea());
}
});
}
}
测试下可以看到,单击button的时候,控制台便输出值了: