首頁 > web前端 > js教程 > jquery仿搜尋自動聯想功能代碼_jquery

jquery仿搜尋自動聯想功能代碼_jquery

WBOY
發布: 2016-05-16 16:46:54
原創
1718 人瀏覽過
複製程式碼如下程式碼:

渡//EN" "http://www.w3.org/TR/html4/loose.dtd">



在此插入標題標題>

body{margin:0px ;padding:0px;}
ul{margin:px;padding:0px;list-style-type:none;}
;


$(function(){
a();
onclick();
$("#txt") .bind("keyup",function(){
txtchange(0 );
});

});

函數a(){
ularray= [];
var data=[{1:11},{1:12},{1:22},{1:33},{1:123}];

//給ul格式化資料
var ul=$("#ul1");
$.each(資料,函數(索引,項目)
{
var li=$("
  • ");

    $.each( item,function(名稱,值)
    {
    var span=$("").html(value )
    li.append(span); >ularray.push(value);
    ul.append(li);

    //排序
    ularray.sort();
    };

    //keyup事件
    function txtchange(flag)
    {
    var textObj=$("#txt").val();
    var divObj=$( "#div1").html();
    var 陣列=[];

    with(divObj)
    {
    var ulHTML=divObj.match(/]* >/)[0];//取得開始標籤
    val = ularray“”; //轉為字串

    for(var i=0;i{
    if(val.split(",")[i].indexOf( textObj)!==-1||flag) // 分割成字串陣列
    {
    array[array. length]="
  • " ularray[i] "
  • ";
    };
    };//把新得到的集合隊列

    var liHtml = "";
    $.each(array,function(item,val){
    liHtml = val;
    });//刪除訂單間備註

    divObj=ulHTML liHtml "> ;”;
    $("#ul1").html(divObj);
    onclick(); //讓新取得的佇列擁有點擊功能
    };
    } ;

    //span 點選事件
    function onclick(){
    $("#ul1 li span").click(function()
    {
    var oli=$ (這個);
    var otxt=$(this).html();
    $("#txt").empty().val(otxt);
    };
    腳本>
    頭>


    ;


    自動提示




    表格>
    中心>
    身體>


    相關標籤:
    來源:php.cn
    本網站聲明
    本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
    最新問題
    熱門教學
    更多>
    最新下載
    更多>
    網站特效
    網站源碼
    網站素材
    前端模板