function replaceDate(select) { var value = select.value; var text = select.options[select.selectedIndex].text; var span = document.createElement('span'); span.innerHTML = text; select.parentNode.insertBefore(span, select); select.style.display = 'none'; select.setAttribute('data-value', value); } 修改 replaceDate函数,使其能够选择日期后,单元格日期选择器替换为选择的日期
时间: 2023-06-18 21:06:12 浏览: 177
javascript实现日期选择
function replaceDate(select) {
var value = select.value;
var text = select.options[select.selectedIndex].text;
var span = document.createElement('span');
span.innerHTML = text;
select.parentNode.insertBefore(span, select);
select.style.display = 'none';
select.setAttribute('data-value', value);
// 新增代码开始
var td = select.parentNode.nextElementSibling;
var input = document.createElement('input');
input.type = 'date';
input.value = value;
input.onchange = function() {
var newValue = input.value;
var newText = newValue;
span.innerHTML = newText;
select.value = newValue;
select.setAttribute('data-value', newValue);
select.style.display = '';
input.parentNode.removeChild(input);
};
td.appendChild(input);
// 新增代码结束
}
在函数中新增了一段代码,用于创建一个 input 元素,并将其插入到单元格中。当用户选择日期后,会触发 input 的 onchange 事件,将选择的日期更新到原先的 select 元素中,并将单元格中的 input 元素删除,同时恢复原先的 select 元素的显示。
阅读全文