修改表单时更改 class

Question

所以我一直在查看我能收集到的所有信息，并想出了以下代码：

$('form :input').change(function () {
  $('.save-changes').removeClass('btn-default').addClass('btn-warning');
});

我想做的是检测整个表单中的任何更改，并更改按钮的 class 以提醒用户他们需要在更改实际发生之前单击 "Save changes"效果。

不幸的是，作为 jQuery 的新手，我似乎无法弄清楚为什么我的代码无法正常工作。任何帮助将不胜感激！

这是按钮的 HTML（但我怀疑问题出在那里）：

<button type="submit" class="btn btn-default full-width save-changes" value="submit">Save changes</button>

哦，我把 jQuery 直接放到 <script> 标签之间的页面源代码中。

根据要求，我创建了一个 JSFiddle：https://jsfiddle.net/eg8a5x37/1/

Answer 1

您实际上只需要在文档就绪事件中执行此操作即可。

$(function() {
$('form :input').change(function () {
    $('.save-changes').removeClass('btn-default').addClass('btn-warning');
});
});

Change class when form modified