Question

让MyFunction()是一些JavaScript函数。是否可以将“ onblur”和“ onchange” HTML DOM事件组合在一起（最好使用原始Javascript），以便在两个事件都被触发时（紧接在另一个事件之后）准确地调用MyFunction()？例如，如果我有一个HTML5日期字段，则希望在以下情况下调用“ MyFunction（）”

日期字段已更改，并且
日期字段在更改后失去焦点。

我无法正常工作的代码段会这样：

<input type="date" 'onchange onblur'="MyFunction()">

Answer 1

解决方案1： 声明用于跟踪日期是否已更改的全局变量，然后在模糊时对其进行重置。

var dateValueChanged = false;

function onChange(){
  dateValueChanged = true;
}

function onBlur(){
  if(dateValueChanged){
    //do thing
    alert('value has changed and blur');
    dateValueChanged = false;
  }
}

和HTML：

<input type="date" onchange="onChange()" onblur="onBlur()">

https://plnkr.co/edit/xPlZ6GoSOE7wo5VrXJYz?p=preview

解决方案2 ：将元素传递给onchange，并在onchange函数中修改元素的onblur

function onChange(el){
  el.setAttribute("onblur", "onBlur(this)");
}

function onBlur(el){
  //do thing
  alert('value has changed and blur');
  el.setAttribute("onblur", "");
}

HTML

<input type="date" onchange="onChange(this)">

https://plnkr.co/edit/PYQ2qITv4SZvh80cCQSM?p=preview

如何结合“ onchange”和“ blur” HTML DOM事件

1 个答案: