Javascript 组合两个输入事件

我的目标是从输入中删除javascript，因此我编写了一些jquery

javascript：

    <input type="text" id = "IDthisinput'" class="CLthisinput'"  placeholder="First"
            onChange   = "dosomething();"
            onKeyPress = "this.onchange();"
            onpaste    = "this.onchange();"
            oninput    = "this.onchange();"
    />
    <span id="ReturnedMsg"></span>
    <span id="IDActionVal"></span>

当谈到将上面的内容缩短为类似这样的内容时，我感到很困惑，因为这样做效果很好：

    $('.CLthisinput').on('keyup', 'paste', function () {
            var theaction = event
            $('#ReturnedMsg').html(dotuff('#'+this.id,$(this).val()));
            $('#IDActionVal').html('#'+this.id + '  ' + theaction + '  ' + $(this).val());
    });

---

我怎样才能让这些活动协同工作

在同一字符串中枚举两个事件，以空格分隔：

$('.thisinput').on('keyup paste', function () {
        var theaction = event
        $('#ReturnedMsg').html(dotuff('#'+this.id,$(this).val()));
        $('#IDActionVal').html('#'+this.id + '  ' + theaction + '  ' + $(this).val());
});

您不能将它们作为单独的参数传递，因为

$（'.thisinput'）。on（'keyup'，'paste'，…）

会执行完全不同的操作：当

内的

标记内发生

事件时，它会触发

标记（并允许动态添加

标记）

您可以使用

event.type

查找事件的类型：

$('.thisinput').on('keyup paste', function () {
        var theaction = event
        $('#ReturnedMsg').html(dotuff('#'+this.id,$(this).val()));
        $('#IDActionVal').html('#'+this.id + '  ' + theaction.type + '  ' + $(this).val());
});

另外，不要使用全局

事件

对象（也称为

窗口.event

）。这是微软推出的一款浏览器，在Firefox中不起作用。相反，将事件作为参数传递给回调：

$('.thisinput').on('keyup paste', function (event) {
        var theaction = event
        $('#ReturnedMsg').html(dotuff('#'+this.id,$(this).val()));
        $('#IDActionVal').html('#'+this.id + '  ' + theaction.type + '  ' + $(this).val());
});

此外，您实际上不需要将

action

和

event

作为单独的变量：

$('.thisinput').on('keyup paste', function (theaction) {
        $('#ReturnedMsg').html(dotuff('#'+this.id,$(this).val()));
        $('#IDActionVal').html('#'+this.id + '  ' + theaction.type + '  ' + $(this).val());
});

---

在同一字符串中枚举两个事件，以空格分隔：

$('.thisinput').on('keyup paste', function () {
        var theaction = event
        $('#ReturnedMsg').html(dotuff('#'+this.id,$(this).val()));
        $('#IDActionVal').html('#'+this.id + '  ' + theaction + '  ' + $(this).val());
});

您不能将它们作为单独的参数传递，因为

$（'.thisinput'）。on（'keyup'，'paste'，…）

会执行完全不同的操作：当

内的

标记内发生

事件时，它会触发

标记（并允许动态添加

标记）

您可以使用

event.type

查找事件的类型：

$('.thisinput').on('keyup paste', function () {
        var theaction = event
        $('#ReturnedMsg').html(dotuff('#'+this.id,$(this).val()));
        $('#IDActionVal').html('#'+this.id + '  ' + theaction.type + '  ' + $(this).val());
});

另外，不要使用全局

事件

对象（也称为

窗口.event

）。这是微软推出的一款浏览器，在Firefox中不起作用。相反，将事件作为参数传递给回调：

$('.thisinput').on('keyup paste', function (event) {
        var theaction = event
        $('#ReturnedMsg').html(dotuff('#'+this.id,$(this).val()));
        $('#IDActionVal').html('#'+this.id + '  ' + theaction.type + '  ' + $(this).val());
});

此外，您实际上不需要将

action

和

event

作为单独的变量：

$('.thisinput').on('keyup paste', function (theaction) {
        $('#ReturnedMsg').html(dotuff('#'+this.id,$(this).val()));
        $('#IDActionVal').html('#'+this.id + '  ' + theaction.type + '  ' + $(this).val());
});

---

另一种方法是将该职能外包，如：

var helper = function() {
  $('#ReturnedMsg').html(dotuff('#'+this.id,$(this).val()));
  $('#IDActionVal').html('#'+this.id + '  ' + 'keyup ' + $(this).val());
}
$('.CLthisinput').on('keyup', helper);
$('.thisinput').on('paste', helper);

---

另一种方法是将该职能外包，如：

var helper = function() {
  $('#ReturnedMsg').html(dotuff('#'+this.id,$(this).val()));
  $('#IDActionVal').html('#'+this.id + '  ' + 'keyup ' + $(this).val());
}
$('.CLthisinput').on('keyup', helper);
$('.thisinput').on('paste', helper);

---

谢谢，我现在看到了，我添加了一个变量动作，这样我就可以确定它是哪个事件，有什么帮助吗？我喜欢它，我也喜欢解决方案和解释。谢谢。我也喜欢卢米奥的答案，我相信如果我没有在类名上打错的话，这两个事件会在同一个字符串中被列举出来。为两条路线干杯。回复：。干杯，是自学路线阻碍了我！我过去一定读过十几遍了，你把我的var作为函数param连接了更多的神经元！！谢谢，我现在看到了，我添加了一个变量动作，这样我就可以确定它是哪个事件，有什么帮助吗？我喜欢它，我也喜欢解决方案和解释。谢谢。我也喜欢卢米奥的答案，我相信如果我没有在类名上打错的话，这两个事件会在同一个字符串中被列举出来。为两条路线干杯。回复：。干杯，是自学路线阻碍了我！我过去一定读过十几遍了，你把我的var作为函数param连接了更多的神经元！！我喜欢这个和Dzmitry的回答。因为增加了解释，我将接受这个答案。但很高兴看到两个可行的替代方案。谢谢。我喜欢这个和Dzmitry的回答。因为增加了解释，我将接受这个答案。但很高兴看到两个可行的替代方案。谢谢。在你看到类名thisinput的地方（在下面Lumino和Dzmitry的答案中），应该是CLthisinput。这种差异源于我在原帖中的打字错误！在你看到类名thisinput的地方（在下面Lumino和Dzmitry的答案中），它应该是CLthisinput。这种差异源于我在原帖中的打字错误！