ajax实现类似百度和google的下拉框原理
大家在访问 google或百度的时候，假如要搜索“阿凡达”，我们可能只需要输入一个 “阿”字，网站就会自动匹配一些词组供我们选择，这个设计非常人性化。今天我们就此技术简要介绍，本文假设读者不清楚ajax技术细节。
先说说AJAX，我之前也没有关注过这方面，稍微了解了一下，其实它就是一个客户端脚本与服务器动态通信，在WEB界面不刷新的情况下就可以进行交互的一个技术。这个技术能带来非常棒的用户体验，将网页从“表单”提交方式，变成了界面互动方式，使得整个页面看上去交互性更强大，更方便。
ajax 大致流程如下：
1客户端脚本 - 2触发事件 - 3访问服务器脚本 - 4通过固定数据格式回传数据 - 5客户端动态呈现
这里4一般通用的数据传输方式为XML或者jason（轻量级）
下面就我们实现这个自动匹配输入框的一些限制作要求：
1.词汇取自服务器的一个数据库。
2.一次取10个词。
3.词的匹配为子串匹配。
下面看一下相关重要部分的代码：
客户端javascript
var http_request=false;
function on_search()
{
var content = document.getElementById("searchname").value;
if( content != "" )
document.getElementById("searchresult").innerHTML="正在搜索...";
else
document.getElementById("searchresult").innerHTML="";
////////////创建http request//////////////////
http_request=false;
//开始初始化XMLHttpRequest对象
if(window.XMLHttpRequest)//Mozilla浏览器
{
http_request=new XMLHttpRequest();
if(http_request.overrideMimeType)
{//设置MIME类别
http_request.overrideMimeType("text/xml");
}
}
else if(window.ActiveXObject)//IE浏览器
{
try
{
http_request=new ActiveXObject("Msxml2.XMLHttp");
}
catch(e)
{
try
{
http_request=new ActiveXobject("Microsoft.XMLHttp");
}
catch(e){}
}
}
//异常，创建对象实例失败
if(!http_request)
{
document.getElementById("searchresult").innerHTML="<font color=red>Fault error:创建XMLHttp对象失败！</font>";
return false;
}
//在URL添加随机数防止浏览器cache页面
var posturl= "Ajax_test.php?keyword=" + encodeURIComponent(content) + "&random=" + Math.random()*(10000)
相关文档：
该实例首先需要创建数据库，数据库Test唯一表test,该表具有三个列分别为c1,c2,c3, int型，请自行建立数据库并插入几行测试数据。
然后我们希望能将数据库中的数据读取出来，我在此处只是将数据库数据以数据集的方式存放在本地中， ......
一：前端js代码，主要负责创建ajax和动态生成区域列表
<script type="text/javascript">
//i始终指向最后一个select
var i=1;
//创建XMLHttpRequest对象
var XMLHttpReq;
&n ......
最近被这个问题困惑了一段时间
问题的由来是这样的：
在pageload事件中，有一行语句对this.Title赋值： this.Title = dir.name;
由dir的name去动态的生成网页的title
这么做并没有什么问题，但是一旦结合了ajax，问题就出现了
有兴趣的朋友可以尝试一下
在pageload中对this.Title赋值，然后在body中写一个updatepanel ......
该控件可以实现在页面中弹出一个窗口，这个窗口不是一个新的浏览器窗口，而是镶嵌在页面中的一个层。
1 创建一个linkbutton，用于点击打开窗口。
2 拖入一个panel，这个就是我们要弹出的窗口。它也可以是两个嵌套的panel。例程上是这样做的，还是没有明白为什么这么做。
3 拖入一个ModalPopupExtender控件，在该控件的ta ......
在 HTML 的外部文件中一样，标记的组织与其样式、格式和行为是分离的。虽然您肯定可以用 JavaScript 更改元素或文本的样式，但实际更改您的标记所布置的组织却更加有趣。
只要牢记您的标记只为您的页面提供组织、框架，您就能立于不败之地。再前进一小步，您就会明白浏览器是如何接受所有的文本组织并将其转变为超级有趣� ......
