将按键或事件侦听器添加到输入中，“ TypeError：…addEventListener不是函数”

Question

我正在处理一个我不希望输入/返回提交表单的表单，所以我使用了这样的函数。

    $('[name="form"]').keypress(function(e) {
        var charCode = e.charcode || e.keyCode || e.which;
        if (charCode === 13) {
            e.preventDefault();
            return false;
        }
    });

那行得通，但是现在我想分配输入/返回以在表单上的两个输入上执行功能。 我完全被困住了。

为了获得输入，我尝试通过id调用vanilla js，通过id调用jQ，然后将两者与变量进行混合。 我还尝试了.keypress，.keydown，.keyup而不是attachEventListener方法。 无论我做什么，我都会在控制台中收到此错误。

“ TypeError：... addEventListener不是函数”（或按键，击键等）

我也进行了大量研究，但找不到任何解决方案。 我感谢任何建议。 这是当前形式的这段代码，给您带来麻烦。

    var yelpInput = $('#inputURL');
    var googleInput = $('#googleURL');

    yelpInput.addEventListener("keydown", function(e) {
        if (e.keyCode === 13 ) {                        
            alert('do stuff!');
        }
    });

    // Google
    googleInput.addEventListener("keydown", function(e) {
        if (e.keyCode === 13 ) {    
            alert('do stuff!');
        }
    });

谢谢

Answer 1

var yelpInput = $('#inputURL');
var googleInput = $('#googleURL');

yelpInput.keydown(function(e) {
    if (e.keyCode === 13 ) {                        
        alert('do stuff!');
    }
});

// Google
googleInput.keydown(function(e) {
    if (e.keyCode === 13 ) {    
        alert('do stuff!');
    }
});

Answer 2

yelpInput是jQuery包装的对象，没有addEventListener方法。

使用.on在jQuery包装的对象上附加event-handler ，或者使用yelpInput[0].addEventListener yelpInput.get(0).addEventListener / yelpInput.get(0).addEventListener在JavaScript上附加事件，因为yelpInput[0]将是一个DOMElement而不是jQuery-wrapped对象。

 var yelpInput = $('#inputURL'); var googleInput = $('#googleURL'); yelpInput.on("keydown", function(e) { //-----^^^ if (e.keyCode === 13) { alert('do stuff!'); } }); googleInput.on("keydown", function(e) { //-------^^^ if (e.keyCode === 13) { alert('do stuff!'); } });