使用Layui组件获取服务器当前时间
时间: 2023-07-07 08:30:45 浏览: 579
使用 Layui 的组件来获取服务器当前时间,可以使用 `laydate` 组件。`laydate` 组件是一个日期时间选择器,它可以通过 Ajax 向服务器请求当前时间并将其显示在页面上。
以下是一个示例代码:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>获取服务器当前时间</title>
<link rel="stylesheet" href="//cdn.bootcss.com/layui/2.5.6/css/layui.min.css">
<script src="//cdn.bootcss.com/layui/2.5.6/layui.min.js"></script>
</head>
<body>
<input type="text" class="layui-input" id="server-time" value="" readonly>
<script>
layui.use('laydate', function() {
var laydate = layui.laydate;
laydate.render({
elem: '#server-time',
type: 'datetime',
format: 'yyyy-MM-dd HH:mm:ss',
done: function(value, date) {
// 当选择时间后触发
console.log('选择的时间:', value);
},
ready: function() {
// 在组件弹出前触发,用于获取服务器时间
var that = this.elem;
layui.jquery.ajax({
url: '/getServerTime',
type: 'GET',
dataType: 'json',
success: function(data) {
that.val(data.time);
console.log('服务器时间:', data.time);
},
error: function(xhr, status, error) {
console.error('获取服务器时间失败:', error);
}
});
}
});
});
</script>
</body>
</html>
```
这段代码使用了 `laydate` 组件,将其渲染在一个输入框上。在组件弹出前,通过 Ajax 向服务器请求当前时间,并将其填充到输入框中。用户可以选择时间后,会触发 `done` 回调函数,可以在函数中获取用户选择的时间。
阅读全文