3

最新推荐文章于 2024-07-18 09:37:35 发布

原创最新推荐文章于 2024-07-18 09:37:35 发布 · 377 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了一个简单的会员消费信息查询系统实现方案。该系统通过HTML和JavaScript构建前端页面，允许输入会员手机号并实时展示该会员的消费记录。利用AJAX技术进行异步数据请求，从服务器端获取会员数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

memberQuery.html

<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<script src="memberQuery.js"></script>
		<div id="webhead"><h1>会员消费信息查询</h1></div>
	</head>
	<body style="text-align:center">
		<form>
			请输入会员手机号：<br/>
			<input type="text" id="memPhone" size="30" onkeyup="showMember(this.value)"></input>
			<br/>
		</form>		
		<p>
			<div id="listMemberCost"><b>显示会员消费信息</b></div>

		</p>
	</body>
</html>

memberQuery.js

var xmlHttp
function showMember(str){
	xmlHttp=GetXmlHttpObject()
	if (xmlHttp == null) {
		alter("Browser does not support HTTP Request.")
		return 
	}
	
	var url="memberQuery.php"
	url = url + "?memberPhone=" + str
	url = url + "&sid=" + Math.random()
	xmlHttp.onreadystatechange=stateChanged
	xmlHttp.open("GET",url,true);
	xmlHttp.send(null)
}

function stateChanged(){
	if (xmlHttp.readyState == 4 || xmlHttp.readyState == "complete"){
		document.getElementById("listMemberCost").innerHTML = xmlHttp.responseText
	}
}

function GetXmlHttpObject(){
	var xmlHttp = null;
	try{
		//Firefox,Opera 8.0+, Safari
		xmlHttp = new XMLHttpRequest();
	} catch (e){
		//IE
		try {
			xmlHttp = new ActiveXObject("Msxm12.XMLHTTP");
		} catch (e){
			xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
		}
	}
	return xmlHttp;
}