为什么我的jQueryrows.on(“blur”,handler)在无限循环中调用handler()(显然)

5uzkadbs  于 2023-06-05  发布在  jQuery
关注(0)|答案(1)|浏览(620)

使用jQuery 3.6.1.我的代码是:

OSH.setDivisions = function() {
    let rows = $("input[name^='compdiv']");
    rows.on("blur", OSH.doDivisions)
}

OSH.doDivisions = function() {
    alert("In doDivisions()");
    if (OSH.emptyDivisions() == 0) {
        OSH.addDivision();
    }
}

当页面加载时,没有任何事情发生,正如预期的那样。然后,如果我将焦点放在一个name属性以'compdiv'开头的input元素上,然后将焦点移开(通过Tab键或单击),则会弹出警报,正如预期的那样;但当我关闭警报时,它又会弹出来,我想关闭多少次就弹多少次。代码中没有其他内容调用奥什.doDivisions(),也没有编写触发器。
如果有关系,我的页面有一个带有文本输入字段表的表单。该表是用html静态编码的,其中一行包含三个文本输入字段,如下所示:

<tr>
        <td><input id="compdiv_name[]" name="compdiv_name[]" type="text" style="width:320px"/></td>
        <td><input id="compdiv_adult[]" name="compdiv_adult[]" type="text"  style="width:60px"/></td>
        <td><input id="compdiv_jr[]" name="compdiv_jr[]" type="text"  style="width:60px"/></td>
    </tr>

因此,所有三个输入字段都有空值。
其思想是,当焦点离开其中一个字段时,奥什.doDivisions()被触发以调用OSH.emptyDivisions(),OSH.emptyDivisions()依次计算包含3个空值输入字段的行数。如果没有包含3个空值的行,则调用奥什.addDivision()来添加另一行。我确信这是一种常见的模式。
但我不明白为什么这样做不起作用,doDivisions被反复调用,即使我没有触摸表单。

更新:下面是其他函数的代码,奥什. emptyDivisons(),zer00ne怀疑它是罪魁祸首,还有它调用的OSH.addDivision(),以及底部的$(document.ready()调用:

OSH.emptyDivisions = function() {
    let numempty = 0;
    let values = [];
    let rows = $("input[name^='compdiv']");
    for (let i = 0; i < rows.length; ++i) {
        if (rows[i].type != "text") {
            continue;
        }
        if (rows[i].name == "compdiv_name[]") {
            values[i] = rows[i].value;
            if (rows[i + 1].name == "compdiv_adult[]") {
                values[i] += rows[i + 1].value;
                if (rows[i + 2].name == "compdiv_jr[]") {
                    values[i] += rows[i + 2].value;
                    if (values[i] == "") {
                        ++numempty;
                        i += 2;
                    }
                }
            }
        }
    }
    return numempty;
}

OSH.addDivision = function() {
    let data = '\
        <tr>\
            <td><input id="compdiv_name[]" name="compdiv_name[]" type="text" style="width:320px"/></td>\
            <td><input id="compdiv_adult[]" name="compdiv_adult[]" type="text"  style="width:60px"/></td>\
            <td><input id="compdiv_jr[]" name="compdiv_jr[]" type="text"  style="width:60px"/></td>\
        </tr>\
    ';
    $("#lastDivision").before(data);
}

$(document).ready(OSH.setDivisions());
laawzig2

laawzig21#

在厌倦了解雇alert(In doDivisions()),我把它改成console.log("In doDivisions());和低,看它不再循环!所以我的结论是,解除警报会触发任何/所有(?)页面上可见的输入元素。
实际上,我看到我的问题已经有了答案here

相关问题