mootools实现搜索提示文本框 (仿GOOGLE)
来源:互联网 发布:保险网络继续教育 编辑:程序博客网 时间:2024/06/05 22:41
HTML代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AjaxTextBox.aspx.cs" Inherits="AjaxTextBox" %>
<!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>AjaxTextBox</title>
<script type="text/javascript" src="mootools-release-1.11.js" ></script>
<script type="text/javascript" >
var values;
window.addEvent("domready",function(){
$("ajaxtextbox").addEvent("keypress",function(e){
var keychar;
var keynum;
if(window.event) // IE
{
if(window.event.keyCode==8){//判断Backspace键
values=values.substr(0,values.length-1);
$("ajaxtextbox").value=values;
}
keynum = window.event.keyCode;
}
else if(e.which) // Netscape/Firefox/Opera
{
if(e.which==8){
values=values.substr(0,values.length-1);
$("ajaxtextbox").value=values;
}
keynum = e.which;
}
keychar = String.fromCharCode(keynum);
if(/^[a-zA-Z0-9_/u4e00-/u9fa5]+$/.test(keychar)){//判断是不是中文,英文,数字
$("ajaxtextbox").value+=keychar;
values=$("ajaxtextbox").value;
}
if($("ajaxtextbox").value==""){
return;
}
var url="AjaxTextBox.aspx?value="+$("ajaxtextbox").value;
new Ajax(url,{method:'post',
onComplete:function(){
$("msg").innerHTML=this.response.text;
if($("ajaxtextbox").value.length>values.length){
$("ajaxtextbox").value=values;
}
}
}).request();
});
});
function getMsg(obj){
$("ajaxtextbox").value=obj.innerHTML;
$("msg").innerHTML="";
}
</script>
</head>
<body>
<input type="text" id="ajaxtextbox" name="ajaxtextbox" style="width:170px;" runat="server" />
<div id="msg" style="width:170px;"></div>
</body>
</html>
.CS代码:
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public partial class AjaxTextBox : System.Web.UI.Page
{
public static DataTable dt = new DataTable();
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
if (dt.Rows.Count == 0)
{
dt.Columns.Add("cotents");
DataRow dr = dt.NewRow();
dr[0] = "0a2b3c";
DataRow dr1 = dt.NewRow();
dr1[0] = "0e2f3g";
dt.Rows.Add(dr);
dt.Rows.Add(dr1);
}
}
if (!String.IsNullOrEmpty(Request["value"]))
{
Seach(Request["value"]);
}
}
protected void Seach(string value)
{
string seach = "<div style=/"width:170px; background-color:InfoBackground;/" ;>";
for (int i = 0; i < dt.Rows.Count; i++)
{
if(dt.Rows[i]["cotents"].ToString().StartsWith(value.Trim()))
{
seach += "<div style=/"width:170px; cursor:pointer;/" onclick=/"getMsg(this)/" >" + dt.Rows[i]["cotents"].ToString() + "</div>";
}
}
seach += "</div>";
Response.Clear();
Response.Write(seach);
Response.End();
}
}
- mootools实现搜索提示文本框 (仿GOOGLE)
- 仿google搜索提示
- 仿Google搜索自动提示
- 仿Google搜索自动提示
- Domino下实现仿Google搜索提示效果
- 仿google搜索提示(没连数据库)
- 仿google搜索提示(可以连数据库)
- 仿google搜索提示SuggestFramework的使用
- 仿Google搜索自动提示 jQuery+Ajax
- 仿百度和google的搜索提示
- 仿google搜索提示 SuggestFramework的使用
- Qt 控件 实现 QComboBox输入自动提示功能(仿Google搜索提示)
- 实现类似google搜索效果,文本框输入智能提示,(经过改进 支持多个文本框的效果)
- 仿google、百度搜索框输入信息智能提示的实现 兼容主流浏览器
- 仿google、百度搜索框输入信息智能提示的实现 兼容主流浏览器
- 搜索结果仿google搜索提示SuggestFramework的使用
- C++ 实现 google搜索提示
- 浅谈asp.net通过本机cookie仿百度(google)实现搜索input框自动弹出搜索提示
- 全面解析恶意软件 从rootkit到bootkit
- VC调试入门
- JS键盘事件
- Const用法小结
- applet 读写客户端文件
- mootools实现搜索提示文本框 (仿GOOGLE)
- js键盘事件全面控制
- memory leak in occi
- 在WIN2000中图片不能进行“缩略图”,怎么解决?
- JS键盘控制事件教程
- 关于java中JDK5的打包,拆包以及"=="和equals的问题
- 飞信和QQ的CMD命令行接口
- JS屏蔽键盘
- JS之经典代码段