Heim > Web-Frontend > js-Tutorial > Hauptteil

JQuery-Imitationssuche automatische Assoziationsfunktion code_jquery

WBOY
Freigeben: 2016-05-16 16:46:54
Original
1703 Leute haben es durchsucht
复制代码 代码如下:





Titel hier einfügen


<script> <br>$(function(){ <br>a(); <br>onclick(); <br>$("#txt").bind("keyup",function(){ <br>txtchange(0 ); <br>}); <br><br>}); <br><br>function a(){ <br>ularray=[]; <br>var data=[{1:11},{1:12},{1:22},{1:33},{1:123}]; <br><br>//给ul传入数据 <br>var ul=$("#ul1"); <br>$.each(data,function(index,item) <br>{ <br>var li=$("<li></li>"); <br><br>$.each( item,function(name,value) <br>{ <br>var span=$("<span></span>").html(value); >ularray.push(value); <br>}); <br><br>//排序 <br>ularray.sort(); <br>}; <br><br>//keyup事件 <br>function txtchange(flag) <br>{ <br>var textObj=$("#txt").val(); <br>var divObj=$("#div1").html(); <br>var array=[]; <br><br>with(divObj) <br>{ <br>var ulHTML=divObj.match(/<[^>]*>/)[0];//拿到开始标签 <br> val = ularray ""; //转为字符串 <br><br>for(var i=0;i<ularray.length;i ) <br>{ <br>if(val.split(",")[i].indexOf( textObj)!==-1||flag) //分割成字符串数组 <br>{ <br>array[array.length]="<li><span>" ularray[i] "</span></li>"; <br>}; <br>};//把新得到的集合放入数组 <br><br>var liHtml = ""; <br>$.each(array,function(item,val){ <br>liHtml = val; <br>});//去掉数组间逗号 <br><br>divObj=ulHTML liHtml "</ul&gt ;"; <br>$("#ul1").html(divObj); <br>onclick(); //让新得到的数组拥有点击功能 <br>}; <br>}; <br><br>//span单击事件 <br>function onclick(){ <br>$("#ul1 li span").click(function() <br>{ <br>var oli=$( this); <br>var otxt=$(this).html(); <br>$("#txt").empty().val(otxt>}); <br>}; <br></script>






自动提示









Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage