Question

我最初为三个输入字段定义了相同的函数三次，如下所示：

var inputQ = document.getElementById("quantity");
var inputC = document.getElementById("compid");
var inputR = document.getElementById("quantreq");

inputQ.onkeypress = function() {
    //code
}
inputC.onkeypress = function() {
    //same code
}
inputR.onkeypress = function() {
    //same code
}

但是如果缩短为：

，它仍然有效

inputQ.onkeypress = inputC.onkeypress = inputR.onkeypress = function() {
    //code
}

这会产生任何意想不到的影响吗？是否有更短的方式来实现它，如('#inputQ, #inputC, #inputR) = function() {}？

谢谢！

Answer 1

这样可以正常工作（函数只是一个像任何其他函数一样的对象，所以你可以链接赋值）。

如果您想要更短的方式，请使用jQuery：

$("#quantity, #compid, #quantireq").on("keypress", function() {
    // code
});

Answer 2

如果你想让它更通用，而不是每次都指定ID而没有jquery你可以分配你需要验证/检查类的所有东西，然后做一些像......

<input id="quantity" type="text" val="0" class="check" />
<input id="compid" type="text" val="1" class="check" />
<input id="reqid" type="text" val="2" class="check" />

<script>
    function notify(){
        alert( "Here" );
    }

    [].slice.call( document.querySelectorAll( ".check" ) ).forEach( function(){ 
        this.addEventListener( 'keypress' , notify, false); 
    });
</script>

这适用于支持forEach和querySelectorAll的浏览器。

为多个事件定义一个函数

2 个答案: