Question

我有一个div listOfTodos默认为空。 html中没有空格。我还有一个文本框，当按下Enter键时，它会将文本附加到listOfTodos。出于某种原因，is:empty无法正常工作，并且总是说它是空的。

我的检查代码是：

if ($('#listOfTodos').is(':empty')) {
    console.log("empty");
} else {
    console.log("not empty");
}

然后在这段代码上面我也有：

$("#someTextbox").keypress(function(e) {
        if (e.keyCode == 13) {
            $('#listOfTodos').append('<label>Some text</label>'); } 
});

保存上面的标签，并在每次重新加载时检索。发生了什么事？

Answer 1

JS不会从上到下运行代码吗？我在我的js文件中的if语句上方有按键。

是的，但事件处理程序在触发事件之前不会执行，直到完成整个脚本后才能执行。

即。

$("#someTextbox").keypress(function(e) {
    if (e.keyCode == 13) {
        $('#listOfTodos').append('<label>Some text</label>');
    } 
});

if (....) { }

在事件处理程序绑定后

，

将仅执行一次。

如果要在事件触发后运行，则必须将if语句放在处理程序中：

if

如果要在多个位置运行该逻辑，请将其置于函数中：

$("#someTextbox").keypress(function(e) { if (e.keyCode == 13) { $('#listOfTodos').append('<label>Some text</label>'); if ($('#listOfTodos').is(':empty')) { console.log("empty"); } else { console.log("not empty"); } } });

Answer 2

使用

if ($.trim($('#listOfTodos').text()) == '') {
  alert("empty");
} else {
  alert("not empty");
}

Fiddle

是：空不适用于动态创建的内容

2 个答案: