看看这个非常简单的jsfiddle：https://jsfiddle.net/gq9jga4q/33/

<input type="text" id="kbdhook" />

<div id="result" >1: </div>

<div id="result2" >2: </div>

<div id="result3" >3: </div>

$('#kbdhook').keyup(function(event) {
      var current = $('#kbdhook').val();
      if (current !== '' && current !== '\n') {
        var c, l;
        for (l = 0; l < current.length; l++) {
          c = current[l];
          $("#result").html($("#result").html() + c);
        }

        $("#result2").html($("#result2").html() + " " + $('#kbdhook').val());
        $('#kbdhook').val('');
        $("#result3").html($("#result3").html() + " " + $('#kbdhook').val());
      }
  });

我的目标是能够为input元素中键入的每个键调用一个函数。
我订阅了keyup事件，对于其中的每一个字母，我都将它们附加到文档中，然后清除文本输入，以便下次重新启动。

#resultdiv是要发送到外部库的输出。
#result2用于说明当你快速输入时，在一个keyup事件中会注册多个字母（没关系）。
#result3用于显示清除输入后，它确实被很好地清除。

这在桌面（IE/Chrome/Firefox）、iPhone（Safari/Chrome）和Android（Firefox）上都能完美运行。但Android上的Chrome给予了不同的行为。
每次keyup事件被触发时，$('#kbdhook').val()的结果都是$('#kbdhook').val('');“清除”没有发生时的值，但是它发生了，因为**#result3**总是空的。
为什么不同浏览器之间的行为会有如此大的差异，我该如何解决我的问题？