没办法了,ajax的问题纠结了一天了,来求助了
本帖最后由 showbo 于 2012-10-23 20:35:12 编辑 我要做一个搜索提示框,在网上找了很多资料,很多人提供了源码,是的源码没问题,但是我在vs里调试是没问题,但是一到我做的项目里的iis里运行,就没效果了
我把代码贴出来,实在是找不出怎么解决这个问题,
(注:vs中调试没问题,在iis中运行就不出效果了,牛人帮帮忙)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<style type="text/css">
.item_normal
{
border-left: #666 1px solid;
border-right: #666 1px solid;
width: 150px;
background-color: #ffffff;
overflow: hidden;
}
.itemBg
{
border-left: #666 1px solid;
border-right: #666 1px solid;
cursor: default;
background-color: #ffffff;
width: 150px;
}
.item_high
{
background-color: #326BC5;
cursor: default;
width: 150px;
color: white;
}
.item_button
{
border-left: #666 1px solid;
border-right: #666 1px solid;
border-bottom: #666 1px solid;
text-align: right;
background-color: #ffffff;
width: 150px;
cursor: hand;
}
.suggest_hidden
{
display: none;
}
</style>
<body>
<form id="form1" runat="server">
<div>
<input id="KProvince" style="width: 150px;" autocomplete="off" onkeyup="beKeyUp();" />
<p>
<div id="search_suggest" style="position: absolute; z-index: 1;">
</div>
</p>
</div>
</form>
</body>
<script type="text/javascript">
var array = new Array(); //定义一个全局变量数组,用来存放拆分字符串的值,后面具体介绍。
var zz = -1; //此为指针,后面用到
function xmlHttpInitializtions() {
try {
xmlhttpRequest = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
try {
xmlhttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e2) {
xmlhttpRequest = false;
}
}
if (!xmlhttpRequest && typeof XMLHttpRequest != 'undefined') {
xmlhttpRequest = new XMLHttpRequest();
}
}
function beKeyUp() {
var key = document.getElementById("KProvince").value;
if (key.length > 0)//有值才POST,这里最好加个Trim()方法,但是JAVASCRIPT没有现成的方法,自己定义。
{
xmlHttpInitializtions();
xmlhttpRequest.Open("POST", "Test_Ajax.aspx?key=" + key, true); //POST
xmlhttpRequest.onreadystatechange = stateChange; //返回状态调用方法stateChange
xmlhttpRequest.Send();
}
}
function stateChange() {
if (xmlhttpRequest.readystate == 4) {
if (xmlhttpRequest.status == 200) {
var responseStr = xmlhttpRequest.responseText; //获取返回值
if (responseStr.length > 0)//返回值不为空才执行下面的代码
{
array = responseStr.split('|'); //根据‘|’拆分,根据自己任意特殊字符,初始化数组
positionDiv(); //调用方法,定位DIV显示,具体见方法解释
document.getElementById("search_suggest").innerHTML = ""; //每次清空DIV内容
for (var i = 0; i < array.length; i++) {
if (array[i] != "")//项值不为空,组合DIV,每个DIV有onmouseover、onmouseout、onclick对应事件
{
document.getElementById("search_suggest").innerHTML += "<div id='item" + i + "' class='itemBg' onmouseover='beMouseOver(" + i + ")' onmouseout='beMouseOut(" + i + ")' onclick='beClick(" + i + ")'>" + array[i] + "</div>";
}
}
//最后一个DIV显示 关闭 效果 onclick方法
document.getElementById("search_suggest").innerHTML += "<div class='item_button' onclick='hiddenDiv();'><font color='#999999'>关闭</font></div>";
document.getElementById("search_suggest").style.display = "inline";
}
else {
document.getElementById("search_suggest").style.display = "none";
}
}
}
}
//定位DIV显示
function positionDiv() {
var DivRef = document.getElementById("search_suggest");
DivRef.style.position = "absolute";
var t = document.getElementById("KProvince");
DivRef.style.top = getAbsolutePos(t).y; //相对文本框的TOP高度,方法见下面
DivRef.style.left = getAbsolutePos(t).x; //相对文本框的LEFT宽度
DivRef.style.height = array.length * 20; //DIV的高度等于每行20个象素乘行数(也就是数组的长度,体现全局数组的作用,不然要传入数组长度的参数)
}
//实现最后一个DIV 关闭 onclick方法
function hiddenDiv() {
document.getElementById("search_suggest").style.display = "none";
}
//定位方法,不做解释
function getAbsolutePos(el) {
var SL = 0, ST = 0;
var is_div = /^div$/i.test(el.tagName);
if (is_div && el.scrollLeft) SL = el.scrollLeft;
if (is_div && el.scrollTop) ST = el.scrollTop;
var r = { x: el.offsetLeft - SL, y: el.offsetTop - ST };
if (el.offsetParent) {
var tmp = this.getAbsolutePos(el.offsetParent);
r.x += tmp.x;
r.y += tmp.y;
}
return r;
}
//函数鼠标经过效果
function beMouseOverEFF(i) {
if ((i >= 0) & (i <= array.length - 1)) {
document.getElementById("item" + i).className = "item_high";
}
}
//函数鼠标移开效果
function beMouseOutEFF(i) {
if ((i >= 0) & (i <= array.length - 1)) {
document.getElementById("item" + i).className = "item_normal";
}
}
//函数鼠标经过
function beMouseOver(i) {
document.getElementById("KProvince").focus();
beMouseOutEFF(zz);
zz = i;
beMouseOverEFF(zz);
}
//函数鼠标移开
function beMouseOut(i) {
beMouseOutEFF(i);
}
//函数单击
function beClick(i) {
document.getElementById("KProvince").value = array[i];
document.getElementById("search_suggest").style.display = "none";
document.getElementById("KProvince").focus();
}
</script>
</html>
protected void Page_Load(object sender, EventArgs e)
{
if (Request.QueryString["key"] != null)
{
Response.Write("这|下|你|就|满|足|了|吧");
}
}
function beKeyUp() {
var key = document.getElementById("KProvince").value;
if (key.length > 0)//有值才POST,这里最好加个Trim()方法,但是JAVASCRIPT没有现成的方法,自己定义。
{
xmlHttpInitializtions();
//xmlhttpRequest.Open("POST", "Test_Ajax.aspx?key=" + key, true); //POST
xmlhttpRequest.open("POST", "Test_Ajax.aspx?key=" +escape(key), true); //POST////////////////编码下要发送的内容
xmlhttpRequest.onreadystatechange = stateChange; //返回状态调用方法stateChange
//xmlhttpRequest.Send();
xmlhttpRequest.send();//////////////////
}
}
function stateChange() {
//if (xmlhttpRequest.readystate == 4) {
if (xmlhttpRequest.readyState == 4) {
if (xmlhttpRequest.status == 200) {
var responseStr = xmlhttpRequest.responseText; //获取返回值
if (responseStr.length > 0)//返回值不为空才执行下面的代码
{
array = responseStr.split('
[解决办法]
'); //根据‘