تقديم السيارات النموذج بعد ثواني س ميلى من لوحة المفاتيح غير نشط
-
10-07-2019 - |
سؤال
في مستواي لدي مجموعة من صناديق الدخل حيث يمكن للمستخدم إدخال قيمة. على تغيير واحد من هذه الصناديق، والنموذج تلقائيا يحصل المقدمة.
والمشكلة الآن هي مع ذلك أن المستخدم يبقى في الحقل الأخير، ويأخذ الماوس ويضغط على زر موافق (من نوع آخر) دون ترك النص أولا. لا يحصل تشغيل الحدث التغيير والحصول على تمرير والقيم غير صحيحة القديمة إلى الصفحة التالية.
وأريد لتحريك الحدث onchange بعد بضعة miliseconds من لوحة المفاتيح غير نشط. تماما مثل معظم الإضافات الإكمال التلقائي القيام به.
أعتقد أنني يمكن تنفيذ الموقت الذي يبدأ توقيت لحظة دخول حقل المدخلات ويحصل resetted في كل مرة يتم التعامل مع ضغطة مفتاح وبعد ذلك عندما تصل إلى الصفر الحدث onchange يحصل تشغيلها.
وأنا لا ترقى لإعادة اختراع العجلة وأتساءل عما إذا كان هذا الوظيفة متاحة في مكان ما.
اقتراحات؟
المحلول
وكان لي مشكلة مماثلة، وخلق المساعد مسج المستخدمة حاليا في تطبيق الداخلي. يجب أن تؤدي إلى تغيير الحدث بعد الانتهاء من كتابة المستخدم.
إذا كنت لا تستخدم مسج، رمز لا تزال قابلة للتكيف مع أي شيء آخر.
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!
});
نصائح أخرى
هل لا تعمل للقيام و onblur، لذلك كل عندما ينتقل المستخدم إلى الحقل التالي أو ينقر شيء آخر، يتم حفظ القيمة؟
وأنا لا أعرف أن مثل هذا الحل من شأنه أن يعتبر "اختراع إعادة" أي شيء. كما قلت، يبدو أن لا شيء أكثر من setTimeout بسيط مرة واحدة تحميل الصفحة. بعد حوالي 3000 ميلي ثانية، فإنه يعمل form.submit ().
وأنا ربما إعادة العد التنازلي مع كل ضغطة للغاية، لإعطاء المستخدم وقتا كافيا لجعل دخولهم.