javascript - jQuery步进器不触发更改功能

Question

我想在输入字段更改时切换提交按钮的可见性。

由于 Firefox 不支持 HTML5 输入 type="number"，因此我使用 stepper jQuery plugin 。

提交按钮最初是隐藏的，当对包括步进器在内的任何表单字段进行更改时，应该显示提交按钮，但当我更改数字时，不会触发更改事件。

在 Chrome 中，type="number" 字段的默认事件工作正常

HAML

.form-actions.hide{
     :style => 'border-top: none; 
     border-bottom: solid 1px; 
     border-bottom-color: #08C;'
}
%button#submit{
     :type => "submit", 
     :class => 'btn btn-primary', 
     :style => 'margin-top: -28px;'
} Submit

JavaScript

if(BrowserDetect.browser == "Firefox"){
   $('#count').stepper();
}
$('#manage form input[type!=submit], select').change(function() {
   $('#manage form .form-actions').show();
});

Answer 1

检测浏览器并不是最佳选择。相反，检测对数字的支持

function hasNumber() {
  var inp = document.createElement("input");
  inp.setAttribute("type", "number");
  return inp.type !== "text";
}

然后根据你需要的文档

function changeField() {
  $('#manage form .form-actions').show();
}
$(function() {
  if (!hasNumber()) {
  $('#manage form input[type!=submit], select').change(changeField);
    $('#count').stepper({
      onStep: function( val, up ) {
        changeField();
      }
    });
  }
});