input(type=date)怎么回显后端传来的时间
时间: 2024-03-21 18:38:03 浏览: 16
如果你想要在后端传来的时间数据回显到 `input` 标签的 `value` 属性中,你需要对时间字符串进行格式化,将其转换为 `yyyy-MM-dd` 格式的字符串,然后将其赋值给 `input` 元素的 `value` 属性。
假设后端传来的时间数据是一个字符串,格式为 `yyyy/MM/dd`,你可以使用以下代码将其格式化为 `yyyy-MM-dd` 格式的字符串:
```javascript
const dateStr = '2022/05/20';
const date = new Date(dateStr);
const year = date.getFullYear();
const month = (date.getMonth() + 1).toString().padStart(2, '0');
const day = date.getDate().toString().padStart(2, '0');
const formattedDateStr = `${year}-${month}-${day}`;
console.log(formattedDateStr); // 输出:'2022-05-20'
```
然后,将格式化后的字符串赋值给 `input` 元素的 `value` 属性即可:
```html
<input type="date" id="myDate" value="2022-05-20">
```
如果你使用的是前端框架,例如 Vue 或 React,可以将时间格式化的代码封装成一个函数,然后在模板或组件中调用该函数。
相关问题
input(type=date)怎么回显
在HTML中,可以使用value属性来设置input(type=date)的初始日期值以及回显值。例如:
```
<input type="date" id="myDate" value="2022-01-01">
```
上面的代码会在页面加载时将date输入框的值设置为"2022-01-01",并且在用户选择一个新的日期后,该日期会被回显到输入框中。要更新输入框的回显值,可以使用JavaScript来设置value属性的值,例如:
```
document.getElementById("myDate").value = "2022-02-01";
```
上面的代码会将date输入框的回显值更新为"2022-02-01"。
thymeleaf html 中 <textarea 回显后端传过来的值 <input type="input" placeholder="请选择时间" onClick="WdatePicker({dateFmt:'yyyy-MM-dd', minDate:'%y-%M-%d', readOnly:true})" class="form-control radius3" id="closeTime" name="closeTime"/> input这个也回显后端显示的值。
可以使用Thymeleaf的属性绑定语法`${}`来实现HTML元素中的值的回显。对于`<textarea>`元素,可以通过绑定`th:text`属性来实现回显,例如:
```
<textarea th:text="${backendValue}"></textarea>
```
对于`<input>`元素,可以通过绑定`th:value`属性来实现回显,例如:
```
<input type="text" th:value="${backendValue}" />
```
在这个例子中,`${backendValue}`是从后端传递到前端的值。当Thymeleaf渲染页面时,它会将`${backendValue}`替换为实际的值。这样就可以在页面上显示从后端传递过来的值。