[我有废话要说]
开始写ASP,其实不太喜欢.Net的东西。。。不过比较喜欢写JS,也想学下JQuery~就这样吧~
[正文——把JQuery的Autocomplete封了大家调]
需求:
1提供公用的js文件,传入formId和字符数组,输入时,可以根据字符数组在form上autoComplete。
2该字符数组从配置文件中读取
part1:读取xml配置文件,放在Hashtable中:
//公共方法,读取配置文件。
using System;
using System.Xml;
using System.Collections;
namespace com.Origin.Base.test
{
public static class ReadProperty
{
public static Hashtable ht = null;
private static String path = "D://property.xml";
public static string getText(string text)
{
if(ht==null){
init();
}
return (string)ht[text];
}
public static void init()
{
ht = new Hashtable();
string strXmlPath = path;
XmlDocument xDoc = new XmlDocument();
xDoc.Load(@strXmlPath);
//node数量
int count = xDoc.DocumentElement.ChildNodes.Count;
//遍历所有的node
for (int k = 0; k < count; k++)
{
XmlElement pressEle = (XmlElement)xDoc.DocumentElement.ChildNodes[k];
XmlElement pressEleKey;
XmlElement pressEleValue;
pressEleKey = (XmlElement)pressEle.ChildNodes[0];
pressEleValue = (XmlElement)pressEle.ChildNodes[1];
string key = pressEleKey.FirstChild.Value;
string value = pressEleValue.FirstChild.Value;
ht.Add(key, value);
}
}
}
}
注释:加上@标示绝对路径。
@strXmlPath
xml文件格式:
<list>
<node>
<key>language</key>
<value>java,oralce,jajaja,javascript,vb</value>
</node>
</list>
part2:我的asp的cs文件,调用上面的类:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace com.Origin.Base.test
{
public partial class TestWeb : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
public static string getText(string s)
{
string properties = ReadProperty.getText(s);
return properties;
}
}
}
注释:提供getText方法,共界面asp调用。
asp调用该方法和我们的js公有库。
JS文件:
//test.js
function fun(formId, availableTags) {
alert('in fun');
$(formId).autocomplete({
source: availableTags
});
}
最后是asp的界面文件:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="test.aspx.cs" Inherits="com.Origin.Base.test.TestWeb" %>
<%@ Import Namespace="System.Data" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta charset="utf-8">
<title>jQuery UI Autocomplete - Default functionality</title>
<script type="text/javascript" src="test.js"></script>
<script type="text/javascript" src="Scripts/jquery-1.6.4.js"></script>
<script type="text/javascript" src="Scripts/ui/jquery.ui.position.js"></script>
<script type="text/javascript" src="Scripts/ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="Scripts/ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="Scripts/ui/jquery.ui.autocomplete.js"></script>
<script type="text/javascript">
$(function () {
var v1 = '<%=getText("language")%>';
alert(v1);
v = v1.split(",");
fun("#tags", v);
});
</script>
</head>
<body>
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags" />
</div>
<!-- End demo -->
</body>
</html>
注释: $(function (){});会让function中的内容立即执行。
【各种报错录】
1。$(formId).autocomplete
is not a function
solution:把jquery的js文件引入放在一堆scrpt的引入的最后即解决。JS的引入是又顺序的,童鞋们注意。
2。字符文本的字符太多
var v1 = '<%=getText("
language"
)%>';
solution:上面的双引号写成了单引号。。不靠大家spread the world 的精神,还真不知道.NET报的个啥错。
附件是用到的jquery文件。
分享到:
相关推荐
autocomplete——js,css文件+ 例子
jquery.autocomplete.js 、jquery.autocomplete.css
juery autocomplete.css && juery.autocomplete.js文件下载 无损坏
demo,可直接运行查看效果,实现的效果是:在输入框中输入汉字时触发keyup事件,即自动出现多个选项,选中某选项时自动将该选项值和所需属性填充到指定输入框中。
autoComplete.js是一个简单的纯原始Javascript库,该库逐步为速度,多功能性以及与广泛的项目和系统无缝集成而设计,专为用户和开发人员而设计。 产品特点 纯香草Javascript 零依赖 简单易用 轻巧 快速燃烧 ...
Awesomplete是一款实用的轻量级js自动完成autocomplete插件。该autocomplete插件的特点有:轻量级、高度可定制、简单易用、无外部依赖等。
layui自动填充插件,使用教程配合https://www.cnblogs.com/aeolian/p/11993836.html#autoid-6-0-0
gson + autocomplete.js完成的输入自动补全 但是在ff下,中文不能自动补全
autoComplete 自动补全 支持中文补全 中间字查询
运用jquery.autocomplete.js 和jquery.autocomplete.css实现文本框自动补全,直接下载可以看到运行效果,带注释
asp.net仿百度的自动完成(autoComplete) 使用Jquery autocomplete.js插件来完成自动完成,可以从数据库中读取数据 ajax异步显示数据!云计算QQ研究群:96191559
autocomplete 辅助的javascript
jqueery.autocomplete自动补全js+css ,包含jquery.autocomplete.css+jquery.autocomplete.js
jquery.autocomplete.js 无法动态传参,好是纠结哦。研究了半天终于搞明白了,再此做个总结,供以后使用,也分享给用样为此纠结的“童鞋”们。 调用: $("#tag").autocomplete( "url", { delay:10, matchSubset:1, ...
包含jquery.autocomplete相关js文档
利用jquery.autocomplete.js插件实现了文本框自动补全的功能, 附件包含两个实例代码,均以txt文档显示,都有前台和后台代码。一个是传一个参数,一个是传两个参数,后台以一般处理程序ashx文件编写。大家只需要修改...
jQuery autocomplete 自动加载
jquery-autocomplete 自动完成插件
NULL 博文链接:https://canrry.iteye.com/blog/750679