Ajax与Jython结合的简单应用
1. 安装Tomcat
2. 在<TOMCAT_HOME>/webapps/建立文件夹jythonAjax.
3. Go to <TOMCAT_HOME>/webapps/jythonAjax
新建一个jython源文件HelloWorld.py
from javax.servlet.http import HttpServlet class HelloWorld(HttpServlet): def doPost(self, req, res): searchterm = req.getParameter("username") if not searchterm: searchterm = "" usernameList = ['neo', '123', 'rfidic', 'its'] res.setContentType("text/html;charset=utf-8") out = res.getWriter() if searchterm in usernameList: print>>out,"Username has existed, please choose another one." else: print>>out,"Valid username" def doGet(self, req, res): pass |
注意：文件名一定要与文件中定义的类名相同。
4. 新建/webapps/jythonAjax /WEB-INF/lib目录，将jython安装目录下的jython.jar拷贝到该目录下，在/webapps/jythonAjax /WEB-INF下新建一个web.xml文件，内容如下：
<?xml version="1.0" encoding="UTF-8"?> <web-app id="WebApp_ID" version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"> <display-name>JythonAjaxHelloworld</display-name> <welcome-file-list> <welcome-file>index.html</welcome-file> <welcome-file>index.htm</welcome-file> <welcome-file>index.jsp</welcome-file> <welcome-file>default.html</welcome-file> <welcome-file>default.htm</welcome-file> <welcome-file>default.jsp</welcome-file> </welcome-file-list> <servlet> <servlet-name>PyServlet</servlet-name> <servlet-class> org.python.util.PyServlet </servlet-class> <init-param> <param-name>python.home</param-name> <param-value>C:\jython2.2.1</param-value> </init-param> <init-param> <param-name>python.path</param-name> <param-value>C:\jython2.2.1\Lib</param-value> </init-param> <load-on-startup>1</load-on-startup> </servlet> <servlet-mapping> <servlet-name>PyServlet</servlet-name> <url-pattern>*.py</url-pattern> </servlet-mapping> </web-app> |
5. 新建<TOMCAT_HOME>/webapps/jythonAjax/helloworld.jsp
<html>
<head>
<script>
var xmlHttp
function isValidUsername(str)
{
if (str.length==0)
{
document.getElementById("txtHint").innerHTML="";
return;
}
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("您的浏览器不支持AJAX！");
return;
}
var url="http://localhost:8080/jythonAjax/HelloWorld.py";
url=url+"?username="+str;
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("POST",url,true);
xmlHttp.send(null);
}
function stateChanged()
{
if (xmlHttp.readyState==4)
{
document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
}
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
</script>
</head>
<body>
<form>
Username:<input />
</form>
<p>Suggestions: <span></span></p>
</body>
</html> |
6. 启动Tomcat服务器。在FF或IE输入http://localhost:8080/jythonAjax/helloworld.jsp。
可以看到输入用户名，没有刷新页面的情况下，下面显示了用户名是否合法的信息。
7. 以上是基本的应用，如果想拥有如下图一样的Loading等待效果。
很简单，操作DOM对象即可。
新加入一个DIV
<div style="display: none;"><img src="loading.gif"/></div> |
修改js函数
function stateChanged() { if (xmlHttp.readyState==4) { document.getElementById("txtHint").innerHTML=xmlHttp.responseText; document.getElementById('loading').style.display="none"; } else { document.getElementById("txtHint").innerHTML="" document.getElementById('loading').style.display="block"; } } |
在程序中加入sleep函数，模拟服务器延时。
from javax.servlet.http import HttpServlet import time class HelloWorld(HttpServlet): def doPost(self, req, res): searchterm = req.getParameter("username") if not searchterm: searchterm = "" usernameList = ['neo', 'qu', 'rfidic', 'its'] time.sleep(3) res.setContentType("text/html;charset=utf-8") out = res.getWriter() if searchterm in usernameList: print>>out,"Username has existed, please choose another one." else: print>>out,"Valid username" def doGet(self, req, res): pass |