gpt4 book ai didi

javascript - 表单重置后立即执行代码

转载 作者:搜寻专家 更新时间:2023-11-01 04:37:33 25 4
gpt4 key购买 nike

<分区>

如何在表单重置后立即运行一段代码?

reset 事件在表单字段被重置为其默认值之前触发。所以,例如:

$('form').on('reset', function(e) {
$('input').val('a value that should be set after the form has been reset');
});

这行不通。 ( Demo )

由于 reset 事件在浏览器处理默认表单重置行为之前触发,上面的代码只是在 reset 之前设置输入的 value > 事件的默认操作发生,将输入的值恢复为其默认值。这是有道理的,因为这样我就可以调用 e.preventDefault() 来取消表单重置。

我的用例要求在表单重置后立即执行代码。在简单的情况下,setTimeout 就足够了:

$('form').on('reset', function(e) {
setTimeout(function() {
$('input').val('yay it works now');
}, 0);
});

这是可行的,因为 setTimeout 将在 将来的某个时间 执行,在 reset 完成冒泡并且浏览器处理了它的默认值之后行动。

但是,这会失去同步性。一旦我必须以编程方式重置表单并从另一个地方对其进行操作,一切都会付诸东流。

$('form').on('reset', function(e) {
setTimeout(function() {
$('input').val("reset'd value");
}, 0);
});

//somewhere in another module..
$('form').trigger('reset');
$('input').val('value after resetting the form');

( Demo )

当然,一切都应该是同步发生的,但只有我的reset事件处理被推送到以后异步运行,因此它在所有当前同步代码堆执行完后结束运行,当它应该在表单重置后立即运行时。

我想到的解决方案:

  • 使用另一个 setTimeoutsetTimeout 之后运行。这太丑陋了,我拒绝跳入 setTimeout hell 。
  • 实现一个用于重置表单的包装器,它采用回调函数或返回一个 promise 对象。不过,这似乎有点矫枉过正。

如果只有 afterreset 事件存在就好了。好吧,我是不是忽略了什么,或者解决方案是我唯一的选择吗?


我在搜索时遇到了这些问题:

但是他们的标题(恕我直言)有点误导,因为它们实际上与我的问题相去甚远。

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com