On an input[type='number'] Edge always returns `NaN` for `valueAsNumber`

问题

The following works fine in Chrome and Firefox, however in Edge it will alert NaN no matter the input

document.querySelector('button').addEventListener('click', function(){
	alert(document.querySelector('input').valueAsNumber);
});

<input type='number' value='34'>
<button>
  Alert number
</button>

Now, I am not asking how to fix this (using parseFloat(el.value) does that trick), I am asking however what Edge did implement valueAsNumber for then if the most basic function doesn't seem to work. As in, how is one supposed to use this property according to Edge.

回答1:

Microsoft Edge is having broken behavior on valueAsNumber. This is reported as bug #669685. In addition, setting valueAsNumber yields an InvalidStateException.

This is fixed in Microsoft Edge 17682, currently available in an Windows Insider build.

回答2:

I don't know why Edge doesn't support valueAsNumber on type="number", but it does support it on range, week, month, and date:

document.addEventListener('click', function(e) {
  if(e.target.nodeName === 'BUTTON') {
    alert(e.target.previousElementSibling.valueAsNumber);
  }
});

<p><input type="range" value="15">          <button>Alert number</button></p>
<p><input type="week"  value="2015-W50">    <button>Alert number</button></p>
<p><input type="month" value="2015-12">     <button>Alert number</button></p>
<p><input type="date"  value="2015-12-12">  <button>Alert number</button></p>

来源：https://stackoverflow.com/questions/34251265/on-an-inputtype-number-edge-always-returns-nan-for-valueasnumber

标签

javascript

html5

microsoft-edge