Question

我想编写一个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事件。

有人帮助吗？谢谢

Answer 1

您在途中的位置。但是只定义了“ 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文档。

将原型函数与按键事件一起使用

1 个答案: