900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > jQuery UI Autocomplete 使用 ajax 方法传输Json数据出现乱码问题的解决

jQuery UI Autocomplete 使用 ajax 方法传输Json数据出现乱码问题的解决

时间:2019-07-02 03:29:47

相关推荐

jQuery UI Autocomplete 使用 ajax 方法传输Json数据出现乱码问题的解决

平台:Vs

jQuery 1.4.2

jquery.ui.autocomplete.js 1.8.5

方法概述:在ajax传输数据时把jquery.ui.autocomplete.js 中的传输值改成encodeURI() 形式,然后在后台处理代码里再用System.Web.HttpUtility.UrlDecode()方法把传输的

值进行解码。

先上图片,无图无真相么!哈哈!

具体请看代码吧:

页面代码:

<link rel="stylesheet" href="JqueryUi/themes/base/jquery.ui.all.css" /> //这个css文件要先放到最前面,否则可能报未定义错误<script type="text/javascript" src="JqueryUi/jquery-1.4.2.min.js"></script><script type="text/javascript" src="JqueryUi/ui/jquery.ui.core.js"></script><script type="text/javascript" src="JqueryUi/ui/jquery.ui.widget.js"></script><script type="text/javascript" src="JqueryUi/ui/jquery.ui.position.js"></script><script type="text/javascript" src="JqueryUi/ui/jquery.ui.autocomplete.js"></script<script language="javascript" type="text/javascript">$(function() {$("#search").autocomplete({source: function(request, response) {$.ajax({url: "UserControl/GetService.ashx",dataType: "json",data: request,success: function(data) {response(data);},});}});});<div><input id="search" type="text" /></div>

后台处理类:

<%@ WebHandler Language="C#" Class="GetService" %>using System;using System.Web;public class GetService : IHttpHandler{public void ProcessRequest(HttpContext context){if (context.Request.QueryString["term"] != null && context.Request.QueryString["term"] != ""){context.Response.Clear();//context.Response.Charset = "gb2312";context.Response.Buffer = true;//context.Response.ContentEncoding = System.Text.Encoding.UTF8;context.Response.ContentType = "text/plain";string ss = System.Web.HttpUtility.UrlDecode(context.Request.QueryString["term"]);//GetQueryString(context.Request.QueryString["term"],false)context.Response.Write(GetLikeUserName(ss));context.Response.Flush();context.Response.Close();context.Response.End();}}/// <summary>/// 拼接json/// </summary>/// <param name="key">关键词</param>/// <returns></returns>private String GetLikeUserName(string key){//System.Text.Encoding.Convert(if (key == null) return "[\"\"]";

// 这里就是获取数据源,大家自己写了System.Data.DataSet ds = Angel.Data.DatabaseHelper.ExecuteDataset("Select * from Services where Service like '%" + key + "%'", "1");int length = ds.Tables[0].Rows.Count;if (length == 0) return "[\"\"]";string[] listWord;if (length > 10){listWord = new string[10];}else{listWord = new string[length];}for (int i = 0; i < length; i++){if (i <= 9){listWord[i] = ds.Tables[0].Rows[i]["Service"].ToString();}else break;}//搜索,返回10个关键词System.Text.StringBuilder sbstr = new System.Text.StringBuilder("[");int ct = listWord.Length;for (int i = 0; i < ct; i++){sbstr.Append("\"" + listWord[i] + "\"");if (i == ct - 1)sbstr.Append("]");elsesbstr.Append(",");}return sbstr.ToString();}public bool IsReusable{get{return false;}}}

下面是最重要的代码了!我们知道像上面那样当GetService.ashx这个类收到 QueryString 时显示的肯定是乱码!

好了打开你引用的jquery.ui.autocomplete.js 我们来修改以下内容

search: function(value, event) {value = value != null ? value : this.element.val();value = encodeURI(value); // 请注意这行代码,是后加上去的// always save the actual value, not the one passed as an argumentthis.term = this.element.val();if (value.length < this.options.minLength) {return this.close(event);}clearTimeout(this.closing);if (this._trigger("search") === false) {return;}return this._search(value);},

查找到 search 这个函数,然后按上面的修改完保存退出!好大功告成!

好了,基本先到这!有什么问题以后我会补充的!今天过的真纠结啊。。。

祝大家开心!

-------------------------------------------------------------------------------------------------------------------

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。