时间戳

首页 > 解决方案 > DirtyForms 不适用于输入隐藏字段

javascript - DirtyForms 不适用于输入隐藏字段

问题描述

我在表单中添加了dirtyForms，以检测输入字段之一的任何更改https://github.com/snikch/jquery.dirtyforms

HTML

<form>
  <input type="text" id="post" name="post">
    
  <input type="hidden" id="body" name="body">
  <froala-editor input="body">

  </froala-editor>
</form>

Javascript

$('document').ready(function() {
   $('form').dirtyForms();
});

然而对于 input hidden 似乎它没有添加脏类，它只适用于input type="text". 关于如何解决这个问题的任何想法？

标签： javascriptjqueryjquery-dirtyforms

解决方案

因为当用户不是在字段中输入数据的人时，它没有意义。

你可以自己做

SO不允许编辑所以我在这里测试

$('form').toggleClass('mydirty', e.target.textContent !== "");

测试编辑器，它比输入字段更有意义

https://plungjan.name/SO/froala/

$('form').dirtyForms({
  helpers: [{
    isDirty: function($node, index) {
      if ($node.is('form')) {
        return $node.hasClass('mydirty');
      }
    }
  }]
});

var editor = new FroalaEditor('#froala')

$(document).on("keyup", function(e) {
  $('form').toggleClass('mydirty', e.target.textContent !== "");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.dirtyforms/2.0.0/jquery.dirtyforms.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/froala-editor@3.2.3/js/froala_editor.min.js"></script>
<form>
  <input type="text" id="post" name="post">

  <input type="hidden" id="body" name="body">
  <div id="froala" input="body">

  </div>
</form>

推荐阅读