`
annan211
  • 浏览: 460997 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

jquery 自动补全方案

 
阅读更多
//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();		        
	});

  • 大小: 8.7 KB
分享到:
评论

相关推荐

    jquery自动补全示例。包括后台,中文乱码解决JS

    **jQuery自动补全插件详解** jQuery 自动补全插件是一种常见的前端开发工具,它为用户在输入框中提供动态建议,提高了用户体验,尤其在处理大量数据输入时显得尤为重要。本示例将涵盖如何使用jQuery实现自动补全...

    jQuery 自动补全

    **jQuery 自动补全插件详解** ...通过自定义数据源和事件处理,开发者可以创建出满足特定需求的自动补全解决方案。在实际项目中,应结合 suggest.js 和 help.txt 文件,根据具体需求进行适配和扩展。

    jQuery百度搜索自动补全插件.zip

    总的来说,jQuery百度搜索自动补全插件结合了jQuery的易用性和typeahead.js的强大功能,为网站搜索提供了高效、个性化的解决方案。通过熟练掌握这两个工具,开发者能够为用户创建更加流畅、直观的交互体验。

    基于Jquery自动补全

    在介绍jQuery自动补全之前,我们先来回顾一下jQuery的基础知识。jQuery是一个JavaScript库,它简化了DOM操作、事件处理、动画设计和Ajax交互。通过使用$符号,我们可以快速地选中页面元素并对其进行操作。例如,`$(...

    jQuery自动补全

    jQuery自动补全是一种常见的前端开发功能,用于提升用户体验,特别是在输入框中进行搜索或填写信息时。这个功能允许用户在输入过程中快速选择匹配的建议项,常见于搜索引擎、表单填充和其他需要动态提示的场景。在...

    jquery -autocomplete(jquery 自动补全)

    总结来说,`jQuery Autocomplete` 是一个强大且灵活的自动补全解决方案,能够轻松地集成到任何 Web 应用中,提供高效的用户输入体验。通过理解并掌握上述知识,你可以根据项目需求定制自己的自动补全功能。

    jQuery实现文本框自动补全

    jQuery Autocomplete是一款强大的JavaScript插件,它为网页中的输入框提供了自动补全功能,极大地提升了用户的交互体验。...通过不断实践和定制,你可以创造出满足特定需求的文本框自动补全解决方案。

    jquery suggest 自动补全插件演示

    总的来说,jQuery Suggest插件是一个强大且易于使用的自动补全解决方案,结合PHP后端,能够实现高效、动态的自动补全功能。在实际开发中,灵活运用其提供的配置选项和API,可以打造出满足各种需求的智能输入体验。

    jquery的autocomplete(自动补全)插件

    **jQuery的Autocomplete插件**是用于实现网页输入框自动补全功能的一种高效解决方案,它极大地提升了用户体验,尤其是在用户需要从大量数据中选择时。这个插件是基于jQuery库的,因此,首先需要确保在项目中引入了...

    自动补全插件.rar

    总的来说,这个“自动补全插件”为前端开发者提供了一种快速实现自动补全功能的解决方案。无论你是初学者还是经验丰富的开发者,都可以通过这个插件和DEMO案例来提升你的项目体验,同时也能深入理解jQuery插件的开发...

    jquery标签自动补全特效源码.zip

    《jQuery实现标签自动补全特效源码解析》 在网页开发中,为了提高用户体验,我们经常需要使用到标签自动补全功能。这个功能允许用户在输入框中输入内容时,系统能够根据已有的数据自动给出匹配建议。jQuery库提供了...

    邮箱自动补全

    总的来说,这个项目提供了一个实用的前端解决方案,通过与jQuery库的结合,使得即使在旧版本的IE浏览器中也能实现高效且用户友好的邮箱地址自动补全功能。对于想要学习或使用类似功能的开发者来说,这个项目是一个很...

    邮箱自动补全代码

    总之,这个"邮箱自动补全代码"压缩包提供了一套完整的前端解决方案,用于提升网页中邮箱输入的用户体验。通过学习和运用这些知识点,开发者可以快速在自己的网页应用中实现类似功能,提高用户输入的效率和满意度。

    jquery 技术 自己开发的自动补全

    本项目是基于jQuery技术实现的一个自定义的自动补全功能,旨在提供一种高效且易用的输入建议解决方案。 自动补全(Autocomplete)通常用于文本输入框,当用户在输入时,系统会根据已输入的部分文字,从预设的数据源...

    JavaScript Suggest自动补全的输入框下拉提示类

    在实际开发中,开发者可能会使用现有的库或框架,如jQuery UI的Autocomplete插件、React的Autosuggest组件或是Vue的Vue-Autocomplete,它们提供了现成的解决方案,简化了开发过程。然而,理解Suggest类的基本工作...

    jQuery实现的文本框自动联想补全特效源码.zip

    2. 132689923676979755:这是一个未明确命名的文件,但考虑到上下文,这很可能是包含jQuery自动补全特效实际代码的文件。可能是一个JavaScript文件(.js),或者是包含HTML和CSS的文件,用于展示和控制补全效果的...

    原创自动补全代码 绝对超值

    使用jQuery来实现自动补全,可以轻松地处理DOM操作、事件绑定和异步数据获取,同时jQuery的良好浏览器兼容性解决了跨浏览器开发的问题。对于不支持某些JavaScript特性的老版本浏览器,jQuery提供了统一的接口,使得...

    java版自动补全

    Java版的自动补全功能是开发中常用的一种增强用户体验的技术,尤其在文本输入、代码编辑器或者搜索框等场景下,能够快速引导用户输入正确的关键词或代码片段。本项目使用Servlet技术在后台进行处理,提供了完整的...

    jQuery文本框input输入关键字自动补全筛选代码.zip

    jQuery的自动补全插件有很多现成的解决方案,如jQuery UI的Autocomplete插件,它们提供了丰富的配置选项和扩展性,但这里的代码可能更简洁,适合初学者理解学习。对于有能力的开发者,可以根据实际需求对代码进行二...

    jQuery文本框自动联想补全特效.zip

    总结,jQuery文本框自动联想补全特效是一个高效且灵活的解决方案,能够提升用户输入体验。通过理解其工作原理和应用场景,开发者可以轻松地将这一功能整合到自己的Web项目中,创造出更加智能、便捷的用户界面。

Global site tag (gtag.js) - Google Analytics