已经下载了my97的日期控件 也看到了效果演示 但是怎么调用还是没研究明白 基本使用: 1. 在使用该日期控件的文件中加入JS库, 代码如下 <script language="javascript" type="text/javascript" src="datepicker/WdatePicker.js"> </script> 2. 在使用该日期控件的文件加载css样式 <link href="datepicker/default/datePicker.css" rel="stylesheet" type="text/css" /> 3. 在input标签里面加上(.net上是CssClass) class="Wdate"
注意:这个是对日期框的样式定义,如果你自己已经对日期框的样式定义了,此步可以不做 4.加上主调函数 onfocus="new WdatePicker('el','dateFmt','showsTime','skin')" -----------------------------------
下载的路径应该没有问题 想请问JSP里怎么调用 请把JSP的代码发一下 最简单的就可以 谢谢!!
注意:这个是对日期框的样式定义,如果你自己已经对日期框的样式定义了,此步可以不做 4.加上主调函数 onfocus="new WdatePicker('el','dateFmt','showsTime','skin')" -----------------------------------
下载的路径应该没有问题 想请问JSP里怎么调用 请把JSP的代码发一下 最简单的就可以 谢谢!!
//直接把控件显示在页面上
WdatePicker({eCont:'div1',onpicked:function(dp){alert('你选择的日期是:'+dp.cal.getDateStr())}})
function test1(){
var date1 = document.getElementById("d11").value;
alert(date1);
}
</script> <body>
<div id="div1"></div>
<table id="table1" align="center">
<tr>
<td>
<input type="button" value="直接点击" >
<input id="d11" type="text" onClick="WdatePicker()"/>
<input type="button" id="button1" value="取得日期的值" onclick="test1()">
</td>
</tr>
<tr>
<td>
<input type="button" value="点击后面的图标" >
<input id="d12" type="text" readonly=true/>
<img onclick="WdatePicker({el:$dp.$('d12')})" src="js/My97DatePicker/skin/datePicker.gif"
width="16" height="22" align="absmiddle">
</td>
</tr>
<tr>
<td>
<input type="button" value="可以显示一年中的第几周" >
<INPUT id=d121 onfocus=WdatePicker({isShowWeek:true})>
</td>
</tr>
<tr>
<td>
<input type="button" value="可以使用一年中的第几周" >
<input type="text" class="Wdate" id="d122"
onFocus="WdatePicker({isShowWeek:true,onpicked:function() {$dp.$('d122_1').value=$dp.cal.getP('W','W');$dp.$('d122_2').value=$dp.cal.getP('W','WW');}})"/>
<br>您选择了第 <INPUT id=d122_1 size=3> (W格式)周, 另外您可以使用WW格式: <INPUT
id=d122_2 size=3> 周
</td>
</tr>
<tr>
<td>
<input type="button" value="可以自定义日期框的弹出位置(400,300)" >
<INPUT class=Wdate id=d16
onfocus=WdatePicker({position:{left:400,top:300}})>
</td>
</tr>
<tr>
<td>
<input type="button" value="和前面的SPAN联动" >
<SPAN id=demospan>2008-01-01</SPAN> <IMG style="CURSOR: pointer"
onclick="WdatePicker({el:'demospan'})" height=22
src="js/My97DatePicker/skin/datePicker.gif" width=16
align=absMiddle>
</td>
</tr>
</table>
</body>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'my97.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
--> </head>
<script type="text/javascript">
//直接把控件显示在页面上
WdatePicker({eCont:'div1',onpicked:function(dp){alert('你选择的日期是:'+dp.cal.getDateStr())}})
function test1(){
var date1 = document.getElementById("d11").value;
alert(date1);
}
</script> <body>
<div id="div1"> </div>
<table id="table1" align="center">
<tr>
<td>
<input type="button" value="直接点击" >
<input id="d11" type="text" onClick="WdatePicker()"/>
<input type="button" id="button1" value="取得日期的值" onclick="test1()">
</td>
</tr>
<tr>
<td>
<input type="button" value="点击后面的图标" >
<input id="d12" type="text" readonly=true/>
<img onclick="WdatePicker({el:$dp.$('d12')})" src="js/My97DatePicker/skin/datePicker.gif"
width="16" height="22" align="absmiddle">
</td>
</tr>
<tr>
<td>
<input type="button" value="可以显示一年中的第几周" >
<INPUT id=d121 onfocus=WdatePicker({isShowWeek:true})>
</td>
</tr>
<tr>
<td>
<input type="button" value="可以使用一年中的第几周" >
<input type="text" class="Wdate" id="d122"
onFocus="WdatePicker({isShowWeek:true,onpicked:function() {$dp.$('d122_1').value=$dp.cal.getP('W','W');$dp.$('d122_2').value=$dp.cal.getP('W','WW');}})"/>
<br>您选择了第 <INPUT id=d122_1 size=3> (W格式)周, 另外您可以使用WW格式: <INPUT
id=d122_2 size=3> 周
</td>
</tr>
<tr>
<td>
<input type="button" value="可以自定义日期框的弹出位置(400,300)" >
<INPUT class=Wdate id=d16
onfocus=WdatePicker({position:{left:400,top:300}})>
</td>
</tr>
<tr>
<td>
<input type="button" value="和前面的SPAN联动" >
<SPAN id=demospan>2008-01-01 </SPAN> <IMG style="CURSOR: pointer"
onclick="WdatePicker({el:'demospan'})" height=22
src="js/My97DatePicker/skin/datePicker.gif" width=16
align=absMiddle>
</td>
</tr>
</table>
</body>
</html>
只需要一个简单的 input就OK了
<script language="javascript" type="text/javascript" src="My97DatePicker/WdatePicker.js"></script>
<input name="Vnd_Date" type="text" size="28" maxlength="10" readonly="true" class="Wdate" onfocus="new WdatePicker(this,'%Y/%M/%D',false)" style="cursor:hand">
这是什么意思?为什么要用new WdatePicker呢?去掉new直接用你的主函数,
onfocus="javascript:WdatePicker('el','dateFmt','showsTime','skin')"
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'my97.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>
<script language="javascript" type="text/javascript" src="My97DatePicker/WdatePicker.js"></script>
<body>
<input id="d12" type="text"/>
<img onclick="WdatePicker({el:$dp.$('d12')})" src="My97DatePicker/skin/datePicker.gif" width="16" height="22" align="absmiddle">
</body>
</html>
这个是我引用控件 写的JSP 可是总显示无法打开 我换好级个浏览器 IE ,TT,GB 都不行
下面是图片:
但是我把 <script language="javascript" type="text/javascript" src="My97DatePicker/WdatePicker.js"></script> 里的 改成错误地址 比如把My去掉
JSP上的控件图片是可以显示的 说明我的路径没错
请问这个是什么问题? 我下载的是最新版本4.0
比如我的例子 src="/app/My97DatePicker/WdatePicker.js"
这样写的话 就要把你my97的东西放在根目录app应用下
如果不行的话 你把你的目录结构发上来
这是目录结构
index.jsp <script language="javascript" type="text/javascript" src="My97DatePicker/WdatePicker.js"> </script>
<body>
开始时间 : <input id="abc" type="text" onclick="WdatePicker()"/>
</body>
JSP上的控件图片是可以显示的 说明我的路径没错
请问这个是什么问题? 我下载的是最新版本4.0 --------------------------------------------------------------------------
检查一下你是不是引入其他js了,它好像与一些js会冲突,导致jsp页面无法访问
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>和<base href=" <%=basePath%>">
至于你那个IE报错 不知道什么原因 我这没问题
把JSP发上来看看呀
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My JSP 'my97.jsp' starting page </title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>
<body>
<script language="javascript" type="text/javascript" src="My97DatePicker/WdatePicker.js"> </script>
开始时间 : <input id="abc" type="text" onclick="WdatePicker()"/>
<input id="d12" type="text"/>
<img onclick="WdatePicker({el:$dp.$('d12')})" src="My97DatePicker/skin/datePicker.gif" width="16" height="22">
</body>
</html> 我的这个就是直接复制11楼然后修改的 目录结构和你的一样 不过这些写在了根目录的index.jsp里
onclick="new WdatePicker(this,'%Y-%M-%D',false)" />