当前位置:首页 > 开发 > Web前端 > Jquery > 正文

jquery 自动补全方案

发表于: 2013-11-07   作者:annan211   来源:转载   浏览次数:
摘要: //var req = "type=" + $('#type').val(); $.post("/data/listDistributorFull.do", null, function(json) { if(json.success !== true){ //提示报错 alert(json.message); } el
//var req = "type=" + $('#type').val();
	$.post("/data/listDistributorFull.do", null, function(json) {	
		if(json.success !== true){
			//提示报错
			alert(json.message);
		} else{		
			var oSelectParent = $('#distributorName'), html = '';
			$.each([color=red]json.object[/color],function(i,n) {
				console.log(n);
				//var distributorName =  n.distributorName=='undefined'?"--":n.distributorName;
				html += '<option list="' + [color=red]json.object[/color].join("|") + '" value="' + n.distributorName + '">' + n.distributorName + '</option>';
			});
			oSelectParent.html('<option id="t" value="">请选择</option>' + html);
			if(oSelectParent.html()){
				$(".styled").select2();  //当Option的直存在时转换节点
				listc();
				function listc(){
					var d=$(".select2-result");
					
					var s=d.not( $(".select2-result").first());
					
					[color=red]var list = $('#distributorName').children('option');[/color][align=left][/align]	[color=red]//此处ID为页面dom			[/color]
					
					var arr=[];
					$.each(list,function(index){
						arr.push($(this).attr('list'));
										
					});
					arr.shift(0);
					for(var i=0;i<s.length;i++){
						s[i].setAttribute('list',arr[i]);
					};
					$.each(d,function(index){
						
						$(this).click(function(){
							
							if($(this).has('.select2-highlighted')&& $(this).text()!='请选择'){
								var values = "";
								var li=$(this).attr('list').split('|');
						        $.each(li,function(i,n) {
							        if(values != ""){
								        values += "\r\n";
							        }
							        values += n;
						        });	
						        $('#key').val($(this).text());        
						        $('#object').val(values);
							}else{
								 $('#key').val('');        
							     $('#object').val('');
							}
						});
					});
				};
			}								
		}
	});

	function onModuleSelectChange(){
		
		var oSelectParent = $('#distributorName'), oSelectChild = $('#service'),html = '', childHtml;[color=red]//distributorName 为页面domID[/color]
		childHtml = '';
		var list = oSelectParent.find(':selected').attr('list') !== undefined && oSelectParent.find(':selected').attr('list').split('|');		
		
		if(list){
		    var values = "";
	        $.each(list,function(i,n) {
		        if(values != ""){
			        values += "\r\n";
		        }
		        values += n;
	        })	;
	        $('#key').val(oSelectParent.val());        
	        $('#object').val(values);
	    };
	    
	};
	
	var oSelectParent = $('#distributorName');
	[color=red]//distributorName 为页面domID[/color]
	
	
	oSelectParent.bind('change',function() {
		onModuleSelectChange();		        
	});

jquery 自动补全方案

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
(1) AutoComplete-JQuery jQuery插件易于集成到现在的表单中(Form)。 (2)Facebook like Autocom
页面 <Head> <link rel="stylesheet" type="text/css" href="css/jquery.autocomplete.css
此插件是自己在网上搜索的一款较好的查询自动补全插件, 结合项目的需要,并参考了百度的自动补全机
jQuery.AutoComplete是一个基于jQuery的自动补全插件。借助于jQuery优秀的跨浏览器特性,可以兼容Ch
今天对我的“来淘宝了网 ”做了一个小小的优化,本身这个网站是有搜索框的,但是经过这段时间的统计
(1)AutoComplete-JQuery jQuery插件易于集成到现在的表单中(Form)。 (2)Facebook like Autocomp
自动补全提示最主要的是使用AutoCompleteTextView控件,继而从与控件关联的ArrayAdapter提供的字符
solr自动补全: http://www.cnblogs.com/ibook360/archive/2011/11/30/2269077.html 在Solr的自动完
自动提示文本框首先离不开文本框<input type="text">本身、而提示框则采用<div>块内嵌
主页:http://www.interiders.com/wp-content/demos/ProtoAutocompleteList/test.html 在Google Chr
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号