论坛交流
首页办公自动化| 网页制作| 平面设计| 动画制作| 数据库开发| 程序设计| 全部视频教程
应用视频: Windows | Word2007 | Excel2007 | PowerPoint2007 | Dreamweaver 8 | Fireworks 8 | Flash 8 | Photoshop cs | CorelDraw 12
编程视频: C语言视频教程 | HTML | Div+Css布局 | Javascript | Access数据库 | Asp | Sql Server数据库Asp.net  | Flash AS
当前位置 > 文字教程 > Javascript教程
Tag:验证,特效,入门,实例,验证,表单,特效,正则表达式,跑马灯,document,函数,代码,getElementByID,菜单,图片,视频教程

Javascript教程_关于Jquery的自动完成插件实例 AutoComplete源码教程

文章类别:Javascript | 发表日期:2010-4-29 9:21:18

Javascript教程_关于Jquery的自动完成插件实例 AutoComplete源码教程

ASP静态数据源

<%
str = "[{'JobName':' Group Leader, Product Management CN and APA'},{'JobName':' Manufacturing Engineer-EM, Nanjing, S&C, ACS'},{'JobName':' secured loan head'},{'JobName':'?单元负责人 - 大理'}]"
response.Write str
%>

 

ASP动态数据源
<%
sql = "select top 4 * from (select distinct(jobname) from jobs where isdeleted=0 and jobname<>'') as a"
dim str
str = "["
set rs = server.CreateObject("ADODB.Recordset")
rs.open sql,conn,1,1
i=1
if rs.recordcount>0 then
    do while not rs.eof
        if i=1 then
            str = str&"{'JobName':'"&replace(rs("jobname"),"'","")&"'}"
        else
            str = str&",{'JobName':'"&replace(replace(replace(rs("jobname"),"'",""),"""",""),"","")&"'}"
        end if
        i=i+1
    rs.movenext
    loop
end if
rs.close
set rs = nothing
conn.close
set conn = nothing
str = str&"]"
'Response.CharSet = "GB2312"
response.Write str
%>
这两段代码的输出结果是一模一样的,可在利用jquery-autocomplete插件调用时,前者很完美,后者无反应!
jquery代码如下:
<script type="text/javascript">
        /*==========用户自定义方法==========*/
        //职位数据
        var jobList;
        //autocomplete选项
        var options = {
            minChars: 1,
            max: 500,
            width: 250,
            scroll: true,
            height: 500,
            matchContains: true,
            formatItem: function(row, rowNum, rowCount, searchItem)
            {
                return rowNum + "/" + rowCount + ": \"" + row.JobName ;
            },
            formatMatch: function(row, rowNum, rowCount)
            {
                return row.JobName;
            },
            formatResult: function(row, rowNum, rowCount)
            {
                return row.JobName;
            }            
        };
        //autocomplete初始化函数
        function initAutoComplete(data)
        {
            jobList = data;
            $("#inputCityName").autocomplete(jobList, options);
                             
        }

        /*==========加载时执行的语句==========*/
        $(function()
        {
            //$.getJSON(url, null, initAutoComplete)  
            $.ajax({
                   url:"test4.asp?d="+Math.random(),
                   dataType:'json',
                   success:initAutoComplete
                   });
        });        
    </script>
视频教程列表
文章教程搜索
 
Javascript推荐教程
Javascript热门教程
看全部视频教程
购买方式/价格
购买视频教程: 咨询客服
tel:15972130058