首页 新闻 搜索 专区 学院

jquery autocomplete样式

0
悬赏园豆:5 [已关闭问题] 关闭于 2010-08-06 10:03

我用了jquery autocomplete控件,可是样式表加上之后没有效果,不知道怎么回事。还请指教

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
<script src="Scripts/jquery.autocomplete.js" type="text/javascript"></script>
<link href="Styles/jquery.autocomplete.css" type="text/css" />
<script language="javascript" type="text/javascript">
//直接由数组获得
$(document).ready((function () {
var data = ["河北省", "河南省", "山东", "北京", "天津"];
$(
"#txtProvince").autocomplete(data);
//由SERVER端获得
$("#txtUser").autocomplete("GetUserName.aspx");
}
));
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
省份:
<input id="txtProvince" type="text" />
</div>
<div>
用户名:
<input id="txtUser" type="text" /></div>
</form>
</body>
</html>

 

陈敬(Cathy)的主页 陈敬(Cathy) | 菜鸟二级 | 园豆:490
提问于:2010-08-05 13:41
< >
分享
所有回答(2)
0

查看下jQuery.AutoComplete.js文件388行

$.Autocompleter.defaults = {
 inputClass: "ac_input",
 resultsClass: "ac_results",//自动提示效果
 loadingClass: "ac_loading",

这边的样式类名和jQuery.AutoComplete.css中定义的是否是一样

kyo-yo | 园豆:5587 (大侠五级) | 2010-08-05 14:02
JS脚本: $.Autocompleter.defaults = { inputClass: "ac_input", resultsClass: "ac_results", loadingClass: "ac_loading", -------- .ac_results { padding: 0px; border: 1px solid black; background-color: white; overflow: hidden; z-index: 99999; } .ac_results ul { width: 100%; list-style-position: outside; list-style: none; padding: 0; margin: 0; } .ac_results li { margin: 0px; padding: 2px 5px; cursor: default; display: block; /* if width will be 100% horizontal scrollbar will apear when scroll mode will be used */ /*width: 100%;*/ font: menu; font-size: 12px; /* it is very important, if line-height not setted or setted in relative units scroll will be broken in firefox */ line-height: 16px; overflow: hidden; }
支持(0) 反对(0) 陈敬(Cathy) | 园豆:490 (菜鸟二级) | 2010-08-05 17:38
今天早上突然发现了自己犯得是一个低级错误啊,少写了rel="stylesheet"。不过还是谢谢了
支持(0) 反对(0) 陈敬(Cathy) | 园豆:490 (菜鸟二级) | 2010-08-06 10:02
0

没有出现不见得就是样式的问题。Styles/jquery.autocomplete.css 足矣。

可能是js代码不完整吧。

$(document).ready(function(){
$(
'#tbxcust_code').autocomplete("../Hotline/CustInfoHandler.ashx",
{
//检索显示样式
minChars: 4,
width:
310,
matchContains:
true,
autoFill:
false,
formatItem:
function(row, i, max) {
return i + "/" + max + ": \"" + row[0] + "\" [" + row[1] + "]";
},
formatMatch:
function(row, i, max) {
return row.name + " " + row.to;
},
formatResult:
function(row) {
return row[1];
}
}
);
//enter完成触发事件
function findValueCallback(event, data, formatted) {

var tax =data[1];

$.post(
"GetCustomerWebService.asmx/GetCustInfoByCustId",
{codeCode:tax},
function(msg){
var myjson;

eval(
'myjson='+$('string',msg).text()+';');
$(
'#tbxcust_code').val(myjson.CustCode);
$(
'#tbxcust_name').val(myjson.CustName);
$(
'#tbxaddress').val(myjson.CustAddress);
$(
'#hiddentimer').val(myjson.CustReturnTimer);
$(
'#tbxtel').val(myjson.tel);
$(
'#txtContact').val(myjson.cust_contact);
$(
'#hiddenID').val(myjson.cust_id);
document.getElementById(
"timer").innerText="本年度第 "+myjson.CustReturnTimer+" 次上门回访。";
}
);
$(document).ajaxError(
function(event,request, settings){
alert(
"出错页面:" + settings.url + "");
});

上面的例子经过测试。检查一下看看那有问题。

邢少 | 园豆:10926 (专家六级) | 2010-08-05 14:20
今天早上突然发现了自己犯得是一个低级错误啊,少写了rel="stylesheet"。不过还是谢谢了
支持(0) 反对(0) 陈敬(Cathy) | 园豆:490 (菜鸟二级) | 2010-08-06 10:01
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册