加入两个文本框实现展示日历的功能
加入两个文本框实现显示日历的功能
下载这个压缩包,可以看到点击文本框,就会弹出一个日历,选择日期后,日期会写入文本框中,我想在一个网页中加入两个这样的文本框,都可以实现这个功能,请问应该怎样改写代码???
有大神帮一下忙,不知道怎么上传文件,就把代码复制下来了,由于字符太多,js和css源代码在下面的回复中。求大神帮帮忙。。。我觉得就跟input那一行,和my.js最后一个函数有关,怎么加入两个input,都可以实现呢?
my.html源代码:
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta name="author" content="jQer"/>
<title>Eui Demo</title>
<link type="text/css" rel="stylesheet" href="css/eui-calendar.css" />
<script src="js/eui-calendar.js"></script>
<style>
html {
background: rgb(238,238,238);
}
body {
font-size: 14px;
line-height: 1.5;
font-family: 微软雅黑, Verdana, sans-serif;
}
#main{
width: 600px;
margin: 0 auto;
}
h1{
margin-bottom: 50px;
}
label[for="birthday"]{
font-weight: bold;
color: rgb(101,101,101);
}
#birthday{
border: 1px solid rgb(212,212,212);
}
#intro{
position: absolute;
top: -1px;
left: 50%;
margin-left: 50px;
color: rgb(72,72,72);
width: 250px;
padding: 30px 50px;
box-shadow: 0 1px 3px rgba(0,0,0,0.05), 0 -5px 16px rgba(0,0,0,0.1) inset;
}
</style>
<link rel="stylesheet" type="text/css" href="my.css">
<script type="text/javascript" src="my.js"></script>
</head>
<body>
<div id="main">
<h1>原生日历控件 [ 新 ]</h1>
<p id="">
<label for="birthday">您的出生日期</label><br />
<input type="text" id="birthday" name="birthday" value="" />
</p>
<div id="intro">
</div>
</div>
</body>
</html>
------解决思路----------------------
实在不行,就再换一个
------解决思路----------------------
分析了一下,没有找到门
但是发现他是 My97日期控件 的早期版本,感觉应该放弃了
可到他官网 http://www.my97.net/ 去下载新版的
使用说明和样例代码都很详尽
------解决思路----------------------
http://www.tcwww.com/article/3/0427-175.htm
下载这个压缩包,可以看到点击文本框,就会弹出一个日历,选择日期后,日期会写入文本框中,我想在一个网页中加入两个这样的文本框,都可以实现这个功能,请问应该怎样改写代码???
有大神帮一下忙,不知道怎么上传文件,就把代码复制下来了,由于字符太多,js和css源代码在下面的回复中。求大神帮帮忙。。。我觉得就跟input那一行,和my.js最后一个函数有关,怎么加入两个input,都可以实现呢?
my.html源代码:
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta name="author" content="jQer"/>
<title>Eui Demo</title>
<link type="text/css" rel="stylesheet" href="css/eui-calendar.css" />
<script src="js/eui-calendar.js"></script>
<style>
html {
background: rgb(238,238,238);
}
body {
font-size: 14px;
line-height: 1.5;
font-family: 微软雅黑, Verdana, sans-serif;
}
#main{
width: 600px;
margin: 0 auto;
}
h1{
margin-bottom: 50px;
}
label[for="birthday"]{
font-weight: bold;
color: rgb(101,101,101);
}
#birthday{
border: 1px solid rgb(212,212,212);
}
#intro{
position: absolute;
top: -1px;
left: 50%;
margin-left: 50px;
color: rgb(72,72,72);
width: 250px;
padding: 30px 50px;
box-shadow: 0 1px 3px rgba(0,0,0,0.05), 0 -5px 16px rgba(0,0,0,0.1) inset;
}
</style>
<link rel="stylesheet" type="text/css" href="my.css">
<script type="text/javascript" src="my.js"></script>
</head>
<body>
<div id="main">
<h1>原生日历控件 [ 新 ]</h1>
<p id="">
<label for="birthday">您的出生日期</label><br />
<input type="text" id="birthday" name="birthday" value="" />
</p>
<div id="intro">
</div>
</div>
</body>
</html>
------解决思路----------------------
实在不行,就再换一个
------解决思路----------------------
分析了一下,没有找到门
但是发现他是 My97日期控件 的早期版本,感觉应该放弃了
可到他官网 http://www.my97.net/ 去下载新版的
使用说明和样例代码都很详尽
------解决思路----------------------
http://www.tcwww.com/article/3/0427-175.htm