Использование функции прототипа с ключевым событием - PullRequest
Новая
       59

Использование функции прототипа с ключевым событием

0 голосов
/ 24 июня 2019

Я хотел бы написать функцию-прототип ajax, которая преобразует верхний знак каждого символа после ввода его в формуляр для нескольких входных данных. 

jQuery.fn.doKeyUpToUpper = function() {
    $(this).val($(this).val().toUpperCase());
}

и связать эту функцию с полями: 

$('#First').doKeyUpToUpper();
$('#Second').doKeyUpToUpper();
$('#Third').doKeyUpToUpper();

, где Первый, Второй и Третий 

<input id=First value="" />
<input id=Second value="" />
<input id=Third value="" />

поля ввода ...

К сожалению, я не знаю, как добавить событие keyup в каждое поле.

Кто-нибудь поможет? Спасибо

1 Ответ

1 голос
/ 24 июня 2019

Вы, где хорошо на вашем пути. Но только определил поведение «keyup» и фактически не установил событие. 

jQuery.fn.doKeyUpToUpper = function () {
  $(this).on('keyup', function () {
    $(this).val($(this).val().toUpperCase());
  });
};

// or a more dynamic alternative
jQuery.fn.toUpperOn = function (event) {
  $(this).on(event, function () {
    $(this).val($(this).val().toUpperCase());
  });
};

// based upon the question in the comments
jQuery.fn.toUpperOn = function (event, callback) {
  $(this).on(event, function () {
    $(this).val($(this).val().toUpperCase());
    if (callback) callback.apply(this, arguments);
  });
};

$("#first").doKeyUpToUpper();
$("#second").toUpperOn('keyup');
$("#third").toUpperOn('keyup', function (event) {
  console.log(this.id, this.value);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input id="first" type="text" />
<input id="second" type="text" />
<input id="third" type="text" />

Более подробную информацию смотрите в документации jQuery.on.

...