插件介绍:My97DatePicker是一款优秀的日历插件,使用简单,功能强大。
使用步骤:
导入相关.js文件(见代码)
书写相关代码
浏览器访问
核心代码:
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML>
<html>
<head>
<title>日历插件的基本使用</title>
<!--引入jQ.js 和相关文件 -->
<script type="text/javascript" src="/js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="/js/My97DatePicker/WdatePicker.js"></script>
<script>
$(function(){
//方式二:
$("#birth1").click(function(){
WdatePicker({
el:this,
readonly:true,
showClear:true
});
});
});
</script>
</head>
<body>
<br><p>
原始日期:
<input type="date" readonly />
插件日期 方式一:
<input type="text" class="Wdate" name="bir" onclick="WdatePicker({el:this,dateFmt:'yyyy-MM-dd'});" readonly/>
插件日期 方式二:
<input type="text" id="birth1" name="birth1" class="Wdate"/>
</body>
</html>
效果图:(方式一和二效果图一样)

技术提高:想用其更强大的功能就自己探索吧。
插件下载地址:https://download.youkuaiyun.com/download/right_hou/10928724
备注:插件建议在在官网上下载
本文介绍了一款功能强大的日历插件My97DatePicker的使用方法,包括导入相关文件、编写代码及浏览器访问步骤。通过两种方式展示了如何在网页中嵌入并使用该插件实现日期选择功能。
351

被折叠的 条评论
为什么被折叠?



