|
#2
yms1232012-09-12 10:04
|
只有本站会员才能查看附件，请 登录
运行demo.htm页面文件后会出现下面输入提示效果。
只有本站会员才能查看附件，请 登录
现在要的是如何把这种输入提示效果运用到自己页面中去。搞了一个多礼拜了，还没搞定。
demo.htm页面代码
程序代码：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>智能输入提示</title>
<link rel="stylesheet" type="text/css" href="css/jquery.suggest.css">
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/j.dimensions.js"></script>
<script type="text/javascript" src="js/aircity.js"></script>
<script type="text/javascript" src="js/j.suggest.js"></script>
<script type="text/javascript">
$(function(){
$("#arrcity").suggest(citys,{hot_list:commoncitys,dataContainer:'#arrcity_3word',onSelect:function(){$("#city2").click();}, attachObject:'#suggest'});
$("#city2").suggest(citys,{hot_list:commoncitys,attachObject:"#suggest2"});
});
</script>
</head>
<body>
<div id="box">
<h1>机票预定智能输入提示DEMO</h1>
<input type="hidden" name="arrcity_3word" id="arrcity_3word" value="" />
<label for="arrcity">出发城市：</label><input type="text" name="arrcity" id="arrcity" />
<div id='suggest' class="ac_results">
</div>
<label for="city2">目的城市：</label><input type="text" name="city2" id="city2" />
<div id='suggest2' class="ac_results">
</div>
<p>具体的功能如下：</p>
<ol>
<li>点击输入框，自动列出热门出行城市；</li>
<li>支持中文/拼音/3字码 输入的智能提示；</li>
<li>支持键盘方向键选择、回车键确定；</li>
<li>支持选择后自定义callback函数；</li>
<li>支持IE6、IE7、IE8、Firefox</li>
</ol>
</div>
</body>
</html>
注意红色代码！<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>智能输入提示</title>
<link rel="stylesheet" type="text/css" href="css/jquery.suggest.css">
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/j.dimensions.js"></script>
<script type="text/javascript" src="js/aircity.js"></script>
<script type="text/javascript" src="js/j.suggest.js"></script>
<script type="text/javascript">
$(function(){
$("#arrcity").suggest(citys,{hot_list:commoncitys,dataContainer:'#arrcity_3word',onSelect:function(){$("#city2").click();}, attachObject:'#suggest'});
$("#city2").suggest(citys,{hot_list:commoncitys,attachObject:"#suggest2"});
});
</script>
</head>
<body>
<div id="box">
<h1>机票预定智能输入提示DEMO</h1>
<input type="hidden" name="arrcity_3word" id="arrcity_3word" value="" />
<label for="arrcity">出发城市：</label><input type="text" name="arrcity" id="arrcity" />
<div id='suggest' class="ac_results">
</div>
<label for="city2">目的城市：</label><input type="text" name="city2" id="city2" />
<div id='suggest2' class="ac_results">
</div>
<p>具体的功能如下：</p>
<ol>
<li>点击输入框，自动列出热门出行城市；</li>
<li>支持中文/拼音/3字码 输入的智能提示；</li>
<li>支持键盘方向键选择、回车键确定；</li>
<li>支持选择后自定义callback函数；</li>
<li>支持IE6、IE7、IE8、Firefox</li>
</ol>
</div>
</body>
</html>
我自己页面也有这2行代码但和这个略有不同，这是我自己的页面这2行代码
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link href="../style/style.css" rel="stylesheet" type="text/css">
是不是这2行代码导致的不能调用？ 但是把上面红色代码复制到我这里面，也不能实现输入智能提示效果，而且还出现乱码。高手指教啊！！ 这么好的效果用不上 干着急啊！！！