首页 php教程 php手册 ajax之搜索提示

ajax之搜索提示

Jun 13, 2016 am 10:35 AM
ajax create table 代码 内容 剪贴板 复制 提示 搜索 数据库

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

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

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

PHP 与 Ajax:构建一个自动完成建议引擎 PHP 与 Ajax:构建一个自动完成建议引擎 Jun 02, 2024 pm 08:39 PM

使用PHP和Ajax构建自动完成建议引擎:服务器端脚本:处理Ajax请求并返回建议(autocomplete.php)。客户端脚本:发送Ajax请求并显示建议(autocomplete.js)。实战案例:在HTML页面中包含脚本并指定search-input元素标识符。

iOS 18 新增'已恢复”相册功能 可找回丢失或损坏的照片 iOS 18 新增'已恢复”相册功能 可找回丢失或损坏的照片 Jul 18, 2024 am 05:48 AM

苹果公司最新发布的iOS18、iPadOS18以及macOSSequoia系统为Photos应用增添了一项重要功能,旨在帮助用户轻松恢复因各种原因丢失或损坏的照片和视频。这项新功能在Photos应用的"工具"部分引入了一个名为"已恢复"的相册,当用户设备中存在未纳入其照片库的图片或视频时,该相册将自动显示。"已恢复"相册的出现为因数据库损坏、相机应用未正确保存至照片库或第三方应用管理照片库时照片和视频丢失提供了解决方案。用户只需简单几步

在PHP中使用MySQLi建立数据库连接的详尽教程 在PHP中使用MySQLi建立数据库连接的详尽教程 Jun 04, 2024 pm 01:42 PM

如何在PHP中使用MySQLi建立数据库连接:包含MySQLi扩展(require_once)创建连接函数(functionconnect_to_db)调用连接函数($conn=connect_to_db())执行查询($result=$conn->query())关闭连接($conn->close())

如何在PHP中处理数据库连接错误 如何在PHP中处理数据库连接错误 Jun 05, 2024 pm 02:16 PM

PHP中处理数据库连接报错,可以使用以下步骤:使用mysqli_connect_errno()获取错误代码。使用mysqli_connect_error()获取错误消息。通过捕获并记录这些错误信息,可以轻松识别并解决数据库连接问题,确保应用程序的顺畅运行。

清华大学与智谱AI重磅开源 GLM-4:掀起自然语言处理新革命 清华大学与智谱AI重磅开源 GLM-4:掀起自然语言处理新革命 Jun 12, 2024 pm 08:38 PM

自2023年3月14日开始,ChatGLM-6B以来,GLM系列模型受到了广泛的关注和认可。特别是在ChatGLM3-6B开源之后,开发者对智谱AI推出的第四代模型充满了期待。而这一期待,随着GLM-4-9B的发布,终于得到了充分的满足。GLM-4-9B的诞生为了赋予小模型(10B及以下)更加强大的能力,GLM技术团队经过近半年的探索,推出了这一全新的第四代GLM系列开源模型:GLM-4-9B。这一模型在保证精度的同时,大幅度压缩了模型大小,具有更快的推理速度和更高的效率。GLM技术团队的探索没

PHP 与 Ajax:创建动态加载内容的解决方案 PHP 与 Ajax:创建动态加载内容的解决方案 Jun 06, 2024 pm 01:12 PM

Ajax(异步JavaScript和XML)允许在不重新加载页面情况下添加动态内容。使用PHP和Ajax,您可以动态加载产品列表:HTML创建一个带有容器元素的页面,Ajax请求加载数据后将数据添加到该元素中。JavaScript使用Ajax通过XMLHttpRequest向服务器发送请求,从服务器获取JSON格式的产品数据。PHP使用MySQL从数据库查询产品数据,并将其编码为JSON格式。JavaScript解析JSON数据,并将其显示在页面容器中。点击按钮触发Ajax请求,加载产品列表。

Mistral 开源代码模型夺得王座!Codestral疯狂训练超80种语言,国内通义开发者请求出战! Mistral 开源代码模型夺得王座!Codestral疯狂训练超80种语言,国内通义开发者请求出战! Jun 08, 2024 pm 09:55 PM

出品|51CTO技术栈(微信号:blog51cto)Mistral发布了首个代码模型Codestral-22B!该模型的疯狂之处不仅在于训练了80多种编程语言,包括许多代码模型忽略的Swift等。他们的速度没有完全一致。要求使用Go语言编写一个“发布/订阅”系统。这里的GPT-4o正在输出,Codestral已经快到看不清的速度交卷了!由于该模型刚刚推出,尚未公开测试。但根据Mistral的负责人说法,Codestral是目前表现最佳的开源代码模型。图片感兴趣的朋友可以移步:-抱抱脸:https

如何用 Golang 连接远程数据库? 如何用 Golang 连接远程数据库? Jun 01, 2024 pm 08:31 PM

通过Go标准库database/sql包,可以连接到MySQL、PostgreSQL或SQLite等远程数据库:创建包含数据库连接信息的连接字符串。使用sql.Open()函数打开数据库连接。执行SQL查询和插入操作等数据库操作。使用defer关闭数据库连接以释放资源。

See all articles