浅谈jQuery模拟12306城市选择框的实现

最新推荐文章于 2024-01-14 21:36:12 发布

筱葭

最新推荐文章于 2024-01-14 21:36:12 发布

阅读量1.7k

点赞数 1

分类专栏： jQuery 文章标签： jQuery

本文链接：https://blog.csdn.net/zhouziyu2011/article/details/53931518

版权

#parent{ width:500px; position:relative; } #text{ height:25px; } #select{ width:420px; height:185px; position:absolute; top:30px; left:0; border:1px sol

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html>
	<head>
		<title></title>
		<style>	
			#parent{
				width:500px;
				position:relative;
			}
			#text{
				height:25px;
			}
			#select{
				width:420px;
				height:185px;
				position:absolute;
				top:31px;
				left:0;
				background:#eeeeee;
			}
			.cities{
				width:60px;
				height:25px;
				line-height:25px;
				margin:5px 5px 0 5px;
				float:left;
				text-align:center;
				font-family:'Times New Roman';
				font-size:15px;
				cursor:pointer;
			}
		</style>
		<script src="js/jquery-1.6.2.min.js"></script>
		<script>
			$(document).ready(function(){
				$("#select").hide();
				$("#text").focus(function(){
					$("#select").show();
				});
				$(".cities").click(function(){
					$("#text").val($(this).text());
					$("#select").hide();
				});
				$("#text").blur(function(){
					setTim

最低0.47元/天解锁文章

筱葭

关注

1
点赞
踩
4

收藏

觉得还不错? 一键收藏
1
评论
浅谈jQuery模拟12306城市选择框的实现

#parent{ width:500px; position:relative; } #text{ height:25px; } #select{ width:420px; height:185px; position:absolute; top:30px; left:0; border:1px sol
复制链接

扫一扫

专栏目录