DirtyForms 不适用于输入隐藏字段

Posted 2023-05-09

【中文标题】DirtyForms 不适用于输入隐藏字段

【英文标题】：DirtyForms does not work on input hidden field

【发布时间】：2021-03-11 17:43:52

【问题描述】：

我在表单中添加了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" 。关于如何解决这个问题的任何想法？

【参考方案1】：

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

你可以自己做

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>

【讨论】：

但是如果我删除输入的文本，它仍然会很脏。感谢您的帮助

@airsoftFreak 查看更新的脚本。我必须在自己的服务器上进行测试

非常感谢您的帮助，但是这个e.target.textContent !== "" 的方法有一些缺点。

例如，如果我将 #body 从 "" 保存到 "something"

如果将"something"编辑为"something new"，它将照常添加mydirty，但如果再次将"something new"删除为"something"，mydirty类将继续存在。