js实现web页面日历,日历代码js

基于 layui 的日期选择器插件。以下是一个简单的示例,演示了如何使用 LayDate:

代码

<!DOCTYPE html>
<html lang=“zh-CN”>
<head>
<meta charset=“UTF-8”>
<meta name=“viewport” content=“width=device-width, initial-scale=1.0”>
<title>LayDate 示例</title>
<link rel=“stylesheet” href=”https://cdn.staticfile.org/layui/2.6.8/css/layui.css%22%3E
</head>
<body>

<h1>LayDate 示例</h1>

<input type=“text” id=“dateInput” placeholder=“请选择日期”>

<script src=”https://cdn.staticfile.org/layui/2.6.8/layui.js%22%3E%3C/script%3E
<script>
layui.use(‘laydate’, function() {
var laydate = layui.laydate;

// 初始化 LayDate
laydate.render({
elem: ‘#dateInput’, // 绑定元素
type: ‘date’, // 设置日期格式为 yyyy-MM-dd
theme: ‘molv’, // 设置主题风格
done: function(value, date) { // 选择日期后的回调函数
console.log(value); // 打印选择的日期值
}
});
});
</script>

</body>
</html>

过期时间:永久公开
创建于:2024-03-21 17:44
150