Question

是否可以检测到输入日期字段不同部分的事件。

<input type="date" value="2018-08-15">

换句话说，用户是否选择了年，月或日（在此特定方案中）。

Answer 1

您可以使用.split。从0开始，然后使用正则表达式以斜杠分隔用户输入。现在，您可以检查每个数组索引的默认值以外的其他值。

类似这样的事情。（未试用）

var d = document.getElementById('date').value;
var dArray = d.split(0, /\//);
for (var i = 0; i < i.length; i++;) {
    if ((dArray[i] === 'mm') || (dArray[i] === 'dd') || (dArray[i] === 'yyyy') { 
        // date incomplete
    }
}

注意：date元素尚不完全支持浏览器。

Answer 2

不幸的是，date元素拒绝提供不完整的数据（如果日期不完整，value不返回任何内容），但是当它完成时，我们可以简单地检查上次更改后的更改，而忽略空数组

请注意，change事件仅在有效输入更改（或从有效输入更改为无效输入）时触发，因此，如果部分日期输入（日期/月/年）无效，则其他事件获胜在无效部分变为有效之前（不会触发更改），才触发更改。

function dateListener(e) {
  let arr = e.target.value.split('-');
  if(!this.prevArr)this.prevArr=[];
  if(this.prevArr[0] != arr[0] && arr[0]) {
    console.log(`The year was changed from ${this.prevArr[0]} to ${arr[0]}`);
  }
  if(this.prevArr[1] != arr[1] && arr[1]) {
    console.log(`The month was changed from ${this.prevArr[1]} to ${arr[1]}`);
  }
  if(this.prevArr[2] != arr[2] && arr[2]) {
    console.log(`The date was changed from ${this.prevArr[2]} to ${arr[2]}`);
  }
  if(arr[0]) this.prevArr=arr; //If the date is falsey (undefined/empty string), so is the whole array.
};

document.getElementById("datefield").addEventListener("change", dateListener);

<input type="date" id="datefield" />

我们在这里所做的事情是利用函数是对象这一事实，并在函数上设置变量以保存输入的先前状态。当然，我们不必这样做，我们可以创建一个不受该函数约束的变量来保存该日期，但是出于舒适性的考虑，我选择这样做。

在javascript中输入日期，检测是否选择了年，月或日

2 个答案: