Как вызвать вкладку, когда пользователь нажимает Enter
Я получил код отсюда jquery, как поймать клавишу ввода и изменить событие на вкладку
(function($) {
$.fn.enterAsTab = function(options) {
var settings = $.extend({
'allowSubmit': false
}, options);
this.find('input, select, textarea, button').live("keypress", {localSettings: settings}, function(event) {
if (settings.allowSubmit) {
var type = $(this).attr("type");
if (type == "submit") {
return true;
}
}
if (event.keyCode == 13) {
var inputs = $(this).parents("form").eq(0).find(":input:visible:not(disabled):not([readonly])");
var idx = inputs.index(this);
if (idx == inputs.length - 1) {
idx = -1;
} else {
inputs[idx + 1].focus(); // handles submit buttons
}
try {
inputs[idx + 1].select();
}
catch (err) {
// handle objects not offering select
}
return false;
}
});
return this;
};
})(jQuery);
Мои вопросы:
Я хочу, чтобы этот скрипт также работал на select (выпадающий список), textarea, кнопку [not with type=submit]. Он отлично работает с textarea и кнопками [не с type = submit], но не работает с select (выпадающий список).
Я обнаружил, что этот сценарий не может перейти к следующему вводу при передаче отключенного ввода. Например, у меня есть три input, qty, qtyConv и memo. все они являются текстовыми полями, но qtyConv отключен. Когда я нахожусь в кол-во и нажимаю ввод, я не могу перейти к заметке.
Любая помощь, чтобы улучшить этот скрипт для удовлетворения моих требований?
Заранее спасибо.
Даниил
Решение: используйте нажатие клавиши вместо нажатия клавиши, как предложено Нитиш Дхаром.
1 ответ
Пара вещей -
Используемыйселектор неверен. Определенный селектор неверен с точки зрения поиска не отключенных, используйте этот вместо -
$(this).parents("form").eq(0).find(":input:visible:not(:disabled):not([readonly])");
В Firefox 29.0 есть ошибка с нажатием клавиши на выбранных входах, вместо этого используйте keydown - Select не работает для вас в Firefox из-за ошибки (или не ошибки), когда они не слушают нажатие клавиш, когда на входе select - https://support.mozilla.org/en-US/questions/998291.
WORKING DEMO - http://codepen.io/nitishdhar/pen/Gxbhm (работает также в Chrome и FF)
Полный код
(function($) {
$.fn.enterAsTab = function(options) {
var settings = $.extend({
'allowSubmit': false
}, options);
$(this).find('input, select, textarea, button').live("keydown", {localSettings: settings}, function(event) {
if (settings.allowSubmit) {
var type = $(this).attr("type");
if (type == "submit") {
return true;
}
}
if (event.keyCode == 13) {
var inputs = $(this).parents("form").eq(0).find(":input:visible:not(:disabled):not([readonly])");
var idx = inputs.index(this);
if (idx == inputs.length - 1) {
idx = -1;
} else {
inputs[idx + 1].focus(); // handles submit buttons
}
try {
inputs[idx + 1].select();
}
catch (err) {
// handle objects not offering select
}
return false;
}
});
return this;
};
})(jQuery);
$("#form").enterAsTab({ 'allowSubmit': true});