ajax之搜索提示

数据库表： 复制内容到剪贴板
代码:

CREATE TABLE `xqbar`.`suggest` (
`id` INT NOT NULL AUTO_INCREMENT ,
`title` VARCHAR( 100 ) NOT NULL ,
`hits` INT NOT NULL DEFAULT 0,
PRIMARY KEY ( `id` )
) ENGINE = InnoDB

insert into suggest(title,hits)values(xqbar.com,100);
insert into suggest(title,hits)values(www.xqbar.com,410);
insert into suggest(title,hits)values(http://xqbar.com,700);
insert into suggest(title,hits)values(mail:xqbar.com,200);
insert into suggest(title,hits)values(ftp:xqbar.com,100);
insert into suggest(title,hits)values(http://www.xqbar.com,70)search.php
(关于php我也是接触不久，下面的php如果罗嗦还望高手指点)
返回的信息字符串要为 xxx1|xxx2$200|100 前后对应 复制内容到剪贴板
代码:

if($_GET["action"]!=){
#获取用户输入的关键字
$keyword=$_GET["keyword"];
#过滤关键字
$keyword=str_replace("[","[[]",$keyword);
$keyword=str_replace("&","[&]",$keyword);
$keyword=str_replace("%","[%]",$keyword);
$keyword=str_replace("^","[^]",$keyword);
#链接数据库
$conn=mysql_connect("localhost","xqbar","xqbaradmin");
#选择数据库
@mysql_select_db("xqbar") or die(sorry);
mysql_query(set names utf-8);
#查询语句
$sql="select title,hits from suggest where title like %".$keyword."% order by hits desc limit 10";
$result=mysql_query($sql);
#循环得到查询结果，返回字符串
#格式为 结果1|结果2$结果1点击次数|结果2点击次数
if($result){
$i=1;$title=;$hits=;
while($row=mysql_fetch_array($result,MYSQL_BOTH))
{
$title=$title.$row[title];
$hits=$hits.$row[hits];
if($i {
$title=$title."|";
$hits=$hits."|";
}
$i++;
}
}
mysql_close();
}
?>
js代码 复制内容到剪贴板
代码:

引入prototye.js有朋友说这个库太大，或者把，不习惯的朋友可以使用jquery.js框架或者直接创建ajax对象，这个我就不想说了，这里直接引用prototye.js框架

创建层和显示查询结果的js代码

var listFrame=document.createElement("iframe");
listFrame.id="rFrame";
listFrame.style.zIndex="1";
listFrame.style.position="absolute";
listFrame.style.border="0";
listFrame.style.display="none";
listFrame.style.width=$(keyword).clientWidth+"px";
listFrame.style.left=getposition($(keyword),offsetLeft)+1+"px";
listFrame.style.top =(getposition($(keyword),offsetTop)+$(keyword).clientHeight +3)+"px";
document.body.appendChild(listDiv);
document.body.appendChild(listFrame);
}
function setstyle(element,classname)
{
switch (classname)
{
case m:
element.style.fontSize="12px";
element.style.fontFamily="arial,sans-serif";
element.style.backgroundColor="#3366cc";
element.style.color="black";
element.style.width=$(keyword).clientWidth-2+"px";
element.style.height="20px";
element.style.padding="1px 0px 0px 2px";
if(element.displaySpan)element.displaySpan.style.color="white"
break;
case d:
element.style.fontSize="12px";
element.style.fontFamily="arial,sans-serif";
element.style.backgroundColor="white";
element.style.color="black";
element.style.width=$(keyword).clientWidth-2+"px";
element.style.height="20px";
element.style.padding="1px 0px 0px 2px";
if(element.displaySpan)element.displaySpan.style.color="green"
break;
case t:
element.style.width="80%";
if(window.navigator.userAgent.toLowerCase().indexOf("firefox")!=-1)element.style.cssFloat="left";
else element.style.styleFloat="left";
element.style.whiteSpace="nowrap";
element.style.overflow="hidden";
element.style.textOverflow="ellipsis";
element.style.fontSize="12px";
element.style.textAlign="left";
break;
case h:
element.style.width="20%";
if(window.navigator.userAgent.toLowerCase().indexOf("firefox")!=-1)element.style.cssFloat="right";
&nb

声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系[e-mail]核实处理。