DWRインスタンス(サーブレットベース:加算、減算、乗算、除算)

4238 ワード

dwrカテゴリの「サーブレット実装:加算、減算、乗算、除算」をDWRフレームワークに基づいて修正します.非同期Ajax実装を使用して、
より良いユーザー体験が得られます.
修正手順:(MathDelegateクラスは変更しない)
1、web.xml
ukを使用します.ltd.getahead.dwr.DWRServletブロック、すべて/dwrで始まるURI
2、dwr.xml
JavaScriptで呼び出すMathDelegateクラスの構成
3、index.jsp
MathDelegateエージェントの導入
web.xml

<!-- The DWR servlet uk.ltd.getahead.dwr.DWRServlet -->
<servlet>
	<servlet-name>dwr-invoker</servlet-name>   
	<servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class>   
</servlet>
<servlet-mapping>
	<servlet-name>dwr-invoker</servlet-name>   
	<url-pattern>/dwr/*</url-pattern>  
</servlet-mapping>
  
<!-- Default page to load in context -->  
<welcome-file-list>  
		<welcome-file>index.jsp</welcome-file>  
</welcome-file-list>

dwr.xml

<create creator="new" javascript="MathDelegate" scope="application">
			<param name="class" value="vivi.test.dwr.MathDelegate" />
</create>

index.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>第一个简单的DWR实例</title>
		<script type="text/javascript" src="dwr/interface/MathDelegate.js"></script>
		<script type="text/javascript" src="dwr/engine.js"></script>
		<script type='text/javascript' src='dwr/util.js'></script>  
		<script language="javascript">
			var a = 0; 
			var b = 0;
			var op = "";
			//do method
			function doMath(){
				a = document.getElementById("numA").value;
				b = document.getElementById("numB").value;
				op = document.getElementById("op").value;
				if(op == "add"){
					MathDelegate.add(a, b, doMathCallBack);
					op = "+";
				}else if(op == "subtract"){
					MathDelegate.subtract(a, b, doMathCallBack);
					op = "-";
				}else if(op == "multiply"){
					MathDelegate.multiply(a, b, doMathCallBack);
					op = "*";
				}else if(op == "divide"){
					MathDelegate.divide(a, b, doMathCallBack);
					op = "/";
				}
			}			
			//call back method
			var doMathCallBack = function(answer){
				document.getElementById("resultDiv").innerHTML = "<h1><font color='red'>" + 
					"RESULT: " + a + " " + op + " " + b + " = " + answer + "</font></h1>";
			}

		</script>
	</head>
	<body>	
		
		<span id="resultDiv"></span><br>
		
		Please enter two numbers, select an operation , and click the equals button:
		<br></br>
	
		<input type="text" id="numA" size="4">
		&nbsp;
		<select id="op">
			<option value="add">+</option>
			<option value="subtract">-</option>
			<option value="multiply">*</option>
			<option value="divide">/</option>
		</select>
		&nbsp;
		<input type="text" id="numB" size="4">
		&nbsp;
		<input type="button" value="=" onclick="doMath();">
		
	</body>
</html>

Larvel操作MongoDB(インライン配列の削除)

.Net-動的呼び出し方法