Question

在Firefox 28.0中，我收到此错误： InvalidStateError：在按下其中一个按钮时，尝试使用不可用或不再可用的对象和以下代码。

在使用浏览器之前，如何正确测试浏览器是否支持stepUp和stedDown方法？

<input id="input0" type="number" value="100" step="5">
<button onClick="up();">stepUp</button>
<button onClick="down();">stepDown</button>

<script type="text/javascript">

   var input0 = document.getElementById('input0');

   function up() {

      'use strict';

      if (typeof input0.stepUp === 'function') {

         input0.stepUp();

      }

   }

   function down() {

      'use strict';

      if (typeof input0.stepDown === 'function') {

         input0.stepDown();

      }

   }

</script>

尝试http://jsfiddle.net/GtHV6/打开浏览器控制台并按其中一个按钮以获取错误。

Answer 1

是的，似乎有一个错误。我为你做了以下事情：

   var input0 = document.getElementById('input0');

   function up() {

      'use strict';

      if (typeof input0.stepUp === 'function') {
          try{
         input0.stepUp();
          }catch(ex){
          var step=Number(input0.step);
              input0.value = Number(input0.value) + step;
          }
      }

   }

   function down() {

      'use strict';

      if (typeof input0.stepDown === 'function') {
          try{
         input0.stepDown();
          }catch(ex){
          var step=Number(input0.step);
              input0.value = Number(input0.value) - step;
          }
      }

   }

ex包含字符串InvalidStateError。

以上将跨浏览器工作

Answer 2

试试这个：

function step(formField, direction) {

    function stepFallback(formField, direction) {
        var directionModifier = direction === 'down' ? -1 : 1,
            step = Number(formField.getAttribute('step'));
        formField.value = Number(formField.value) + (step * directionModifier);
    }

    if (typeof formField.stepUp === 'function' && typeof formField.stepDown === 'function') {
        // We have stepUp/stepDown support
        try {
            // But need a try/catch as support is buggy or partial in e.g. Safari
            if (direction === 'down') {
                formField.stepDown();
            } else {
                formField.stepUp();
            }
        } catch (ex) {
            stepFallback(formField, direction);
        }
    } else {
        // No stepUp/stepDown support: use fallback
        stepFallback(formField, direction);
    }
}

测试stepUp和stepDown方法支持

2 个答案: