5

我试图在不使用 jQuery 的情况下按下 enter 时捕获 onKeyUp。

我目前的代码是：

$('#chatboxtextarea').on('keyup', function (e) {
        var msg = document.getElementById('chatboxtextarea').value;
        if (msg.replace(/\r/g, '\\\\r').replace(/\n/g, '') != "" && e.keyCode == 13) {
            var textarea = document.getElementById('chatboxtextarea');
            textarea.value = '';

            .....code to send.....


        } else if (msg.replace(/\r/g, '\\\\r').replace(/\n/g, '') == '') {
            var textarea = document.getElementById('chatboxtextarea');
            textarea.value = '';
        }
    });

这怎么能用普通的 JavaScript 来代替呢？

4

2 回答 2

3

简单地：

document.getElementById('chatboxtextarea').onkeyup = function (e) {
    e = e || window.event;
    var textarea = this;
    var msg = textarea.value;
    if (msg.replace(/\r/g, '\\\\r').replace(/\n/g, '') != "" && e.keyCode == 13) {
        textarea.value = '';

        .....code to send.....

    } else if (msg.replace(/\r/g, '\\\\r').replace(/\n/g, '') == '') {
        textarea.value = '';
    }
};

编辑：

或者，您可以调用以下内容来添加事件；传递元素对象，事件类型（不带'on'），要调用的函数以及是否使用捕获，只是为了利用不同的浏览器方法：

function addEvent(elm, evType, fn, useCapture) {
  if (elm.addEventListener) {
    elm.addEventListener(evType, fn, useCapture);
  }
  else if (elm.attachEvent) {
    elm.attachEvent('on' + evType, fn);
  }
  else {
    elm['on' + evType] = fn;
  }
};

IE：

addEvent(document.getElementById('chatboxtextarea'), 'keyup', 
  function(e) {
    e = e || window.event;
    ...
  }, false);
于 2013-03-03T18:17:28.257 回答
0

jQuery 在内部做了很多复杂的代码，这些代码很难简单地模仿。如果您只想将相同的事件绑定到相关 ID，那还不错。

用于选择元素：

document.getElementById('chatboxtextarea')
document.querySelector('#chatboxtextarea')
document.querySelectorAll('#chatboxtextarea')[0]

附加事件：

.addEventListener('keyup', function (e) {

对于 IE8-，您必须使用.attachEvent，但它不是一个精确的模拟。对于古代浏览器，使用.onkeyup属性。

于 2013-03-03T18:27:33.570 回答