Javascript x毫秒不活动键盘后自动提交表单
在我的表单中,我有一组输入框,用户可以在其中输入值。 更改其中一个框时,表单将自动提交 然而,现在的问题是,用户停留在最后一个字段,拿着鼠标并按下OK按钮(另一种形式),而不首先离开文本框。更改事件不会被触发,旧的、不正确的值会传递到下一页 我想在几毫秒的非活动键盘后触发onchange事件。就像大多数自动完成插件一样。Javascript x毫秒不活动键盘后自动提交表单,javascript,jquery,html,timer,onchange,Javascript,Jquery,Html,Timer,Onchange,在我的表单中,我有一组输入框,用户可以在其中输入值。 更改其中一个框时,表单将自动提交 然而,现在的问题是,用户停留在最后一个字段,拿着鼠标并按下OK按钮(另一种形式),而不首先离开文本框。更改事件不会被触发,旧的、不正确的值会传递到下一页 我想在几毫秒的非活动键盘后触发onchange事件。就像大多数自动完成插件一样。 我想我可以实现一个计时器,它从您输入一个输入字段开始计时,并在每次处理击键时重置,然后在它达到零时触发onchange事件 我不想重新发明轮子,我想知道这样的功能是否在某处可用
我想我可以实现一个计时器,它从您输入一个输入字段开始计时,并在每次处理击键时重置,然后在它达到零时触发onchange事件 我不想重新发明轮子,我想知道这样的功能是否在某处可用。
建议?我不知道这样的解决方案会被视为“重新发明”任何东西。正如您所说,一旦页面加载,它听起来只不过是一个简单的设置超时。大约3000毫秒后,它运行form.submit()
我可能也会在每次击键时重新开始倒计时,以便给用户足够的时间进行输入。执行onBlur不起作用,因此当用户移动到下一个字段或单击其他内容时,值是否已保存?我遇到了类似的问题,并创建了一个当前在内部应用程序中使用的jQuery插件。它应该在用户完成键入后触发更改事件 如果您没有使用jQuery,那么代码仍然适用于其他任何内容
jQuery.fn.handleKeyboardChange = function(nDelay)
{
// Utility function to test if a keyboard event should be ignored
function shouldIgnore(event)
{
var mapIgnoredKeys = {
9:true, // Tab
16:true, 17:true, 18:true, // Shift, Alt, Ctrl
37:true, 38:true, 39:true, 40:true, // Arrows
91:true, 92:true, 93:true // Windows keys
};
return mapIgnoredKeys[event.which];
}
// Utility function to fire OUR change event if the value was actually changed
function fireChange($element)
{
if( $element.val() != jQuery.data($element[0], "valueLast") )
{
jQuery.data($element[0], "valueLast", $element.val())
$element.trigger("change");
}
}
// The currently running timeout,
// will be accessed with closures
var timeout = 0;
// Utility function to cancel a previously set timeout
function clearPreviousTimeout()
{
if( timeout )
{
clearTimeout(timeout);
}
}
return this
.keydown(function(event)
{
if( shouldIgnore(event) ) return;
// User pressed a key, stop the timeout for now
clearPreviousTimeout();
return null;
})
.keyup(function(event)
{
if( shouldIgnore(event) ) return;
// Start a timeout to fire our event after some time of inactivity
// Eventually cancel a previously running timeout
clearPreviousTimeout();
var $self = $(this);
timeout = setTimeout(function(){ fireChange($self) }, nDelay);
})
.change(function()
{
// Fire a change
// Use our function instead of just firing the event
// Because we want to check if value really changed since
// our previous event.
// This is for when the browser fires the change event
// though we already fired the event because of the timeout
fireChange($(this));
})
;
}
用法:
$("#my_input").handleKeyboardChange(300).change(function()
{
// value has changed!
});
当用户单击使用当前值转到另一页的submit按钮时,就会出现问题。在提交进入下一页的表格之前,没有时间首先重新提交上一张表格。你是对的,我这样做了。我只是对按键事件中的浏览器差异感到震惊。不过到目前为止没有问题,很好。你考虑了一些情况,我没有改变$element.trigger(“Keyboard.change”);至$element.trigger(“变更”);比我天真的实现要好得多。哦,很抱歉,对于这个特定的应用程序,这是一个名称空间事件。您更改它是正确的,我将按照上面的代码进行更改。对我来说,在safari上,键入后单击框外,它将触发该函数