Javascript - получить форму, если текущего местоположения управления

Question

У меня есть форма и она имеет 4 элемента ввода. если пользователь вводит только две записи и клики в любом месте экрана (вне формы) ... Я хотел бы сохранить детали ... это похоже на автоматическое сохранение.

У меня есть идентификатор моего form..i хотите сравнить с формой идентификатор текущего контроля на screen..so, что я могу ssave данные, если обе формы Идентификаторы отличаются ..

могли бы вы скажите мне, как я могу получить идентификатор формы текущего местоположения управления на экране (иногда элемент управления может быть вне форм ... в этом случае идентификатор формы текущего местоположения cotrol будет null) ... но как я могу определить, что в javascript ,

пожалуйста предложить ...

Большое спасибо заранее, Джек.

Answer 1

Это интересный вопрос.

Ну, если вы не подумали ни на секунду (как я, по общему признанию, сделал), вы бы просто зацепили на blur событии соответствующего элемента HTML <form>.

<form onblur="autosave(this)"> 

Однако элемент HTML <form> не поддерживает это событие. Очень жаль.

Я тогда подумал о новом событии jQuery 1.4 focusout().

$('form').focusout(function() { autosave(this); }); 

К сожалению, это событие уволят, а когда вы просто прыгать (вкладки, нажмите) к следующему полю ввода в той же форме. Не очень приятно, это будет слишком дорого для автосохранения на каждом поле. Тот же эффект, что и у $(':input').blur(function() { autosave(this.form); });.

Затем я попробовал наоборот, используя focusin():

$('form').focusin(function() { 
    $(this).addClass('focused'); 
}); 
$(':not(form)').focusin(function(e) { 
    if (!$(e.target).parents('form.focused').length) { 
     var form = $('form.focused').removeClass('focused'); 
     autosave(form); 
    } 
}); 

Как ни странно это работает в IE только и не в других браузерах. Будет другой ошибкой IE/quirk, что focus поддерживается всеми элементами, отличными от элементов ввода.

Ваш лучший выбор, вероятно, будет зависеть от события click().

$('form').focusin(function() { 
    $(this).addClass('focused'); 
}); 
$(':not(form)').click(function(e) { 
    if (!$(e.target).parents('form.focused').length) { 
     var form = $('form.focused').removeClass('focused'); 
     autosave(form); 
    } 
}); 

Это прекрасно работает. Вы можете найти здесь live demo.

_{Обратите внимание, что я не имею в виду, чтобы подтолкнуть вас JQuery (библиотека JS, которая безумно облегчает HTML DOM traversion и манипуляции) через горло или так, но я не вижу хорошие способы простой JavaScript для достижения это без записи в 10 раз больше, чем здесь.}