<html>
<head>
<title>仿百度动态查询</title>
<!--css 代码区-->
<style type="text/css">
.show
{
position:absolute;
color:Red;
}
.show ul
{
list-style:none;
background-color:transparent;
}
</style>
<!--js代码区-->
<script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"> </script>
<script type="text/javascript">
function d() {
alert("从数据库里找数据!");
}
$(document).ready(function () {
//li的点击事件
$('li').click(function () {
var value = $(this).html();
$("#Text1").val(value);
});
//提交点击事件
$("#Button1").click(function () {
var value = $("#Text1").val();
alert(value);
});
})
</script>
</head>
<body>
<!--输入框,提价按钮-->
<div class="two" id="two">
<input id="Text1" type="text" οnkeyup="d()" />
<input id="Button1" type="button" value="提交" />
</div>
<!--动态显示框-->
<div class="show" id="show" >
<ul>
<li id="1">选项1</li>
<li id="2">选项2</li>
<li id="3">选项3</li>
<li id="4">选项4</li>
<li id="5">选项5</li>
</ul>
</div>
<!-- 用于展示-->
<div class="sss">
<table>
<tr>
<th>编号</th>
<th>菜名</th>
<th>单价</th>
<th>数量</th>
</tr>
<tr>
<td>001</td>
<td>龙虾</td>
<td>45</td>
<td>1</td>
</tr>
</table>
</div>
</body>
</html>