jQuery autocomplete函数

来源：互联网发布：godaddy域名转出编辑：程序博客网时间：2024/05/21 22:33

<!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>
    <title></title>
    <style type="text/css">
     #txtKey{width:300px;}
    </style>
    <link href="css/jquery.autocomplete.css" rel="stylesheet" type="text/css" />
    <script src="Jquery1.7.js" type="text/javascript"></script>
    <script src="js/jquery.autocomplete.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            var array = ['asp.net', 'asp.net mvc', 'asp.net ', '刘小', '刘二', '刘雨', '刘星', '张三', '张强', '张责'];
            /*autocomplete函数
            1)获取txtKey中用户输入的值(用户每输入一个字符，都会获取一次)
            2)将获取的值和array集合中的元素进行比较，找出匹配的元素，并且显示出来
            3)会将用户选择的项添加到txtKey中。
            */
            /*
            result函数：对用户选择的结果进行操作。data参数表示用户选择的项
            */

            $('#txtKey').autocomplete(array).result(function (event, data) {
                window.location.href = 'http://www.baidu.com/s?wd=' + data + '&rsv_bp=0&ch=&tn=baidu&bar=&rsv_spt=3&ie=utf-8&rsv_sug3=6&rsv_sug=0&rsv_sug1=3&rsv_sug4=229&inputT=1458';
                $('#Text1').val(data);

            });
        })
    </script>
</head>
<body>
    <input id="txtKey" type="text" /><input id="Button1" type="button" value="百度一下" /><input id="Text2" type="text" />
</body>
</html>