在Javascript中检查文本框是否为空

Question

我写了一个简单的 HTML 文件，带有文本框和提交按钮。它会根据您所提交的内容生成并使用 document.write 显示响应。如果文本框为空，我希望它生成一条提示消息，告诉您输入内容。文本框的 ID 是 chatinput，因此我在开头添加了以下代码：

    var chatinput_box=document.getElementById('chatinput');
    var chatinput=chatinput_box.value;

我有一个条件语句，但是我无法使它正常工作；我已经尝试过了。

    if(chatinput==""){}
    if(chatinput.length=0){}
    if(chatinput=null){}

我尝试了其他一些方法，但都没有正常工作。 是否有其他想法？

- Zach Brantmeier

---

这些无法起作用，因为您使用了赋值运算符：if(chatinput.length=0){} 和 if(chatinput=null){}。 - user2625787

第一个应该可以工作。你的HTML是什么？ - user2625787

由于空字符串为假值，因此即使 if(chatinput) 应该起作用。你能展示一些你的标记吗？因为你的代码似乎没有任何问题...(除了上面提到的赋值运算符) - Simon

显示 #chatinput 的 HTML。 - user2625787

Answer 1

应该是这样的：

var chatinput = document.getElementById("chatinput").value;
if (chatinput == "" || chatinput.length == 0 || chatinput == null)
{
    // Invalid... Box is empty
}

或者简写为：

if (!document.getElementById("chatinput").value)
{
    // Invalid... Box is empty
}

= 赋值，而 == 检查值是否相等。

- user2742371

---

如果你想教授比较运算符和赋值运算符之间的区别，那么你应该真正使用严格比较运算符。https://dev59.com/EnRB5IYBdhLWcg3wv5xA - PlantTheIdea

这句话可以简化为 if(chatinput)，我认为这样做甚至是值得推荐的。 - Simon

@Houssni 很好，你注意到使用插值来实现正确的逻辑了^^ - Simon

我喜欢简写版本，但有什么缺点吗？它真的和第一个一样吗？ - Crismogram

@Crismogram 空值总是被错误地评估，因此您可以毫无问题地使用简写版本。 - user2742371

Answer 2

我只是提供一种替代方案，而不是试图抢走你的风头...

创建一个isEmpty函数以便在各种项目中重复使用。

function isEmpty(val){
    return ((val !== '') && (val !== undefined) && (val.length > 0) && (val !== null));
}

然后，您可以将其应用于任何要素：

if(!isEmpty(chatinput)){
    // hooray its got a value!
}

虽然这个概念是从PHP中抄袭来的，但它非常有用。

- PlantTheIdea

---

我喜欢这个，因为它是一个可重用的、简单的函数。 - FastTrack

是的，完全正确。对于这种东西，可重用性至关重要！ :D - PlantTheIdea

在我看来，这是一种额外的开销。默认文本输入值为空字符串时为假值，所有这些链接测试的结果与直接针对 val 进行布尔测试时完全相同。 - Simon

一个与另一个有什么关系呢？当然你可以写 var myVar = undefined || null; 但是 if(myVar) 仍然是 false... 测试只需要确保值为真，这对于除了 undefined、null、'' 或 length 0 之外的所有内容都是正确的。也许我错过了，但 OP 只是想确保该值不为空，而不是它不是 null（这将在简单的布尔测试中得到覆盖）。 - Simon

啊，是的，你说得对，我稍微读了一下......那是因为仅检查变量使用非严格比较（undefined == 'undefined'），因此它具有长度并返回true）。很好知道，尽管你应该意识到在三个区域中完全相同的评论而没有提供答案会让你看起来像个混蛋。以后请注意。 - PlantTheIdea