Javascript 简单的字符频率计数器，但为什么赢了'；计数不是实时发生的吗？

作为一个小项目，我正在尝试创建一个简单的在线血液学差异计数器。物理计数器（只不过是美化的计算器）运行实验室，每台设备超过1000美元。小型实验室和不发达国家的实验室负担不起这一成本，因此在线解决方案将是有价值的

HTML

使用数字键盘对单元格进行计数

细胞计数：




爆炸：


爆炸%：


分段和带状中性粒细胞：


分段和带状中性粒细胞%：


淋巴细胞：


淋巴细胞百分比：


后骨髓细胞/骨髓细胞：


后骨髓细胞/骨髓细胞%：


早幼粒细胞：


早幼粒细胞%：


单核细胞：


单核细胞百分比：


Nrbc:


Nrbc%：


嗜酸性粒细胞：


嗜酸性粒细胞%：


浆细胞：


浆细胞百分比：


嗜碱性粒细胞：


嗜碱性粒细胞%：


非典型细胞：


非典型细胞%：

我的剧本：

$(window).load(function(){
$("#textarea").keyup(function () {
    var box = $(this).val();
    var len = box.length;
    if (len < 201) {
        $('#counter').val(len);
// count blasts
    var _blast = box.match(/8/g).length;
    var _blast_pct = (_blast / len) * 100;
    $('#bl_num').val(_blast);
    $('#bl_pct').val(_blast_pct);
    // count segs
    var _segs  = box.match(/3/g).length;
    var _segs_pct = (_segs / len) * 100;
    $('#segs_num').val(_segs);
    $('#segs_pct').val(_segs_pct);
    // count meta/myelo
    var _meta  = box.match(/7/g).length;
    var _meta_pct = (_meta / len) * 100;
    $('#meta_num').val(_meta);
    $('#meta_pct').val(_meta_pct);
    // count pros
    var _pro  = box.match(/5/g).length;
    var _pro_pct = (_pro / len) * 100;
    $('#pro_num').val(_pro);
    $('#pro_pct').val(_pro_pct);
    // count lymphs
    var _lym  = box.match(/2/g).length;
    var _lym_pct = (_lym / len) * 100;
    $('#lymph_num').val(_lym);
    $('#lymph_pct').val(_lym_pct);
    // count nrbcs
    var _nrbc  = box.match(/9/g).length;
    var _nrbc_pct = (_nrbc / len) * 100;
    $('#nrbc_num').val(_nrbc);
    $('#nrbc_pct').val(_nrbc_pct);
    // count eos
    var _eos  = box.match(/4/g).length;
    var _eos_pct = (_eos / len) * 100;
    $('#eos_num').val(_eos);
    $('#eos_pct').val(_eos_pct);
    // count mono
    var _mono  = box.match(/1/g).length;
    var _mono_pct = (_mono / len) * 100;
    $('#mono_num').val(_mono);
    $('#mono_pct').val(_mono_pct);
    // count plasma
    var _plasma  = box.match(/6/g).length;
    var _plasma_pct = (_plasma / len) * 100;
    $('#plasma_num').val(_plasma);
    $('#plasma_pct').val(_plasma_pct);
    // count basos
    var _baso  = box.match(/\+/g).length;
    var _baso_pct = (_baso / len) * 100;
    $('#baso_num').val(_baso);
    $('#baso_pct').val(_baso_pct);
    // count atypcal cells
    var _atyp  = box.match(/\-/g).length;
    var _atyp_pct = (_atyp / len) * 100;
    $('#atyp_num').val(_atyp);
    $('#atyp_pct').val(_atyp_pct);
    } else {
        alert("You have counted 200 cells");
    }

});
}); 

$（窗口）.load（函数（）{
$（“#textarea”）.keyup（函数（）{
var-box=$（this.val（）；
var len=长方体长度；
if（len<201）{
$（'计数器'）.val（len）；
//计数爆炸
var\u blast=box.match（/8/g）.长度；
var _blast _pct=（_blast/len）*100；
$（'bl_num'）.val（'u blast）；
美元(bl pct).val(blast pct);；
//计数分段
变量segs=box.match（/3/g）.length；
var _segs_pct=（_segs/len）*100；
$（'segs_num'）.val（'u segs'）；
$（'segs_pct'）.val（'u segs_pct'）；
//梅塔/骨髓计数
var\u meta=box.match（/7/g）.length；
var(meta)pct=(meta/len）*100；
$（'#meta_num'）.val（_meta）；
$（'meta#pct'）.val（'meta#pct'）；
//数一数专业人士
var\u pro=box.match（/5/g）.length；
var pro pct=（pro/len）*100；
$（'pro#num'）.val（'u pro'）；
$（'pro#u pct'）.val（'pro#u pct'）；
//数淋巴
var _lym=box.match（/2/g）.length；
var _lym _pct=（_lym/len）*100；
$（'lumbh_num'）.val（'u lym）；
$（'lumb#pct'）.val（'u-lym_-pct'）；
//计数NRBC
var _nrbc=box.match（/9/g）.length；
var _nrbc _pct=（_nrbc/len）*100；
$（'#nrbc_num'）.val（_nrbc）；
$（'nrbc_pct'）.val（'u nrbc_pct'）；
//计数状态方程
var _eos=box.match（/4/g）.length；
var_eos_pct=（_eos/len）*100；
$（'eos_num'）.val（'u eos'）；
$（'eos_pct'）.val（'u eos_pct'）；
//单声道计数
var _mono=box.match（/1/g）.length；
var _mono _pct=（_mono/len）*100；
$（'#mono_num'）.val（_mono）；
$（'mono_pct'）.val（'u mono_pct'）；
//计数血浆
var _plasma=box.match（/6/g）.长度；
var _plasma _pct=（_plasma/len）*100；
$（'#plasma_num'）.val（_plasma）；
$（'u plasma_pct'）.val（'u plasma_pct'）；
//巴索斯伯爵
var\u baso=box.match（/\+/g）.length；
var(var)baso(var)pct=（(var)baso/len）*100；
$（'baso_num'）.val（'u baso'）；
$（'baso#u pct'）.val（'u baso#u pct'）；
//计数典型细胞
var\u atyp=box.match（/\-/g）.length；
var atyp pct=（atyp/len）*100；
$（'#atyp_num'）.val（_-atyp）；
$（'atyp_pct'）.val（'u atyp_pct'）；
}否则{
警报（“您已计数200个单元格”）；
}
});
}); 

---

我有一个粗略的例子（见这里：），但我不明白为什么字符频率数据不能实时填充？当用户使用数字键盘对他们在显微镜中看到的细胞进行计数时，计数器似乎先等待某些实例发生，然后再填充图的其余部分。这不是一个理想的情况

好吧，我想我知道了。我的控制台日志突出显示了一个错误，如果我的.match语句没有找到任何匹配项，它将返回null，因此null.length无效

因此，我在初始if语句之外使用了.match参数，并添加了一系列if语句，以便：

    // count blasts
if (box.match(/8/g) !== null) {
    var _blast = box.match(/8/g).length;
    var _blast_pct = (_blast / len) * 100;
    $('#bl_num').val(_blast);
    $('#bl_pct').val(_blast_pct);
}

等等，每一次按键匹配

现在，这些框将实时填充

请看这里：

    // count blasts
if (box.match(/8/g) !== null) {
    var _blast = box.match(/8/g).length;
    var _blast_pct = (_blast / len) * 100;
    $('#bl_num').val(_blast);
    $('#bl_pct').val(_blast_pct);
}