<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<style>

#text{

    width:300px;

    height:30px;

    padding:5px;

    border:1px solid #f90;

    font-size:16px;

    }

#ul1{

    width:310px;

    padding:0;

    margin:0;

    border:1px solid #f90;

    display:none;

    }

li a{

    line-height:30px;

    padding:5px;

    text-decoration:none;

    color:black;

    display:block;

    }

li a:hover{

    background:#f90;

    color:white;}

</style>

<script>

function may(data)

{

    var oul1 = document.getElementById('ul1');

    var html = '';

    if(data.s.length)

    {

        oul1.style.display = 'block';

        for(var i = 0; i < data.s.length; i++)

        {

            html += '<li><a target= "_blank" href="http://www.baidu.com/s?wd='+data.s[i]+'">'+data.s[i]+'</a></li>'

        }

        oul1.innerHTML = html;

    }

    else

    {

        oul1.style.display = 'none';

    }

}

window.onload = function ()

{

    var otext = document.getElementById('text');

    var oul1 = document.getElementById('ul1');

    otext.onkeyup = function ()

    {

        if(this.value != '')

        {

            var oscript = document.createElement('script');

            oscript.src = 'http://suggestion.baidu.com/su?wd='+this.value+'&cb=may';

            document.body.appendChild(oscript);

        }

        else

        {

            oul1.style.display = 'none';

        }

    }

}

</script>

</head>

<body>

<input id="text" type="text">

<ul id="ul1">

    <li><a href="#">1</a></li>

    <li><a href="#">2</a></li>

    <li><a href="#">3</a></li>

</ul>

</body>

</html>

ajax 模仿百度下拉的更多相关文章

  1. angular的跨域（angular百度下拉提示模拟）和angular选项卡

    1.angular中$http的服务: $http.get(url,{params:{参数}}).success().error(); $http.post(url,{params:{参数}}).su ...

  2. vue的jsonp百度下拉菜单

    通过vue的jsonp实现百度下拉菜单的请求,vue的版本是2.9.2 <!DOCTYPE html> <html lang="en"> <head& ...

  3. ajax 多级联动 下拉框 Demo

    写了ajax实现级联下拉框,考虑常用,并且级联个数随不同业务个数不同,于是就整理了一下,实现了 ajax + N级联动 下拉框的效果 效果图 HTML 代码 <h2> 省级联动</h ...

  4. 用Ajax遍历三级下拉框

    用Ajax遍历三级下拉框 //通过一级分类的id查二级分类(记得在前端网页按钮绑定点击事件) function getSecondCategory(oneCategoryId){ alert(&quo ...

  5. 【亲测好用！】shell批量采集百度下拉框关键词

    [亲测好用!]shell批量采集百度下拉框关键词 SEO工具  方法  11个月前 (11-18)  2153浏览 3条评论 百度已收录 一直想写一篇用shell采集百度下拉框关键词的教程,个人感觉用 ...

  6. 仿百度下拉关键词，和关键词的小demo

    自己做项目时用到的仿百度下拉关键词 代码: $(function(){ var oTxt = document.getElementById('search_text'); oTxt.onkeyup ...

  7. ajax实时获取下拉数据

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> ajax ...

  8. vue实现百度下拉框

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  9. ajax三级联动下拉菜单

    ajax写三级联动,先写一个文件类吧,以后用的时候直接调用即可: 来找一张表: 实现: 中国地域的三级联动:省.市.区: 图: 说一下思路: (1)当用户选择省份的时候触发事件,把当前的省份的id通过 ...

随机推荐

  1. 域用户直接登陆(C#,MVC)

    域用户直接登陆MVC网页,未做测试,待测试后进行细化和补充 1. 服务器与客户端必须在同一个域名下. 2. WEB.CONFIG文件中的身份验证方式,使用Windows身份验证: 3. IIS的网站属 ...

  2. 计算文件的MD5值(Java & Rust)

    Java public class TestFileMD5 { public final static String[] hexDigits = { "0", "1&qu ...

  3. 编写类String的构造函数、析构函数和赋值函数

    已知类String的原型为: class String {   public:  String(const char *str = NULL); // 普通构造函数  String(const Str ...

  4. serialize-and-deserialize-bst

    https://leetcode.com/problems/serialize-and-deserialize-bst/ 1. 用到Java Queue接口, // LinkedList实现了Queu ...

  5. JS 原型链学习总结

    废话篇: 在js的学习过程中有一大难点就是原型链.学习的时候一直对这一内容不是十分的明白.纠结的我简直难受.,幸好总算给他弄通了,哇咔咔,总算可以不用在睡梦中还想着他了. 正文篇: 要了解原型链我们首 ...

  6. Qt之国际化

    简介 Qt国际化属于Qt高级中的一部分,本想着放到后面来说,上节刚好介绍了Qt Linguist,趁热打铁就一起了解下. 对于绝大多数的应用程序,在刚启动时,需要加载默认的语言(或最后一次设置的语言) ...

  7. HDU 1080 Human Gene Functions

    最长公共子序列的变形 题目大意:给出两个基因序列,求这两个序列的最大相似度. 题目中的表格给出了两两脱氧核苷酸的相似度. 状态转移方程为: dp[i][j] = max(dp[i-1][j]+Simi ...

  8. （转）gLFlush()和gLFinish()

    笔者初使用OpenGL之时,所遇到的命令不能生效的问题:比如开始想用gLClearColor来设置背景色为红色,结果执行后背景还是默认的黑色.后来查阅资料,才知道这与OpenGL的指令执行流程有关,要 ...

  9. 【英语】Bingo口语笔记(13) - Call系列

    call off - call it off 取消它 call it a day / call it a night 今天到此结束吧/今晚到此结束吧

  10. 查询mysql数据库表的信息（表大小、数据大小、索引大小）

    select * from information_schema.TABLES where information_schema.TABLES.TABLE_SCHEMA='databasename' ...