如果在咖啡脚本中

Question

各位，

我的 html 中有两个文本框。我想使用咖啡脚本比较它们的值。虽然我已经用谷歌搜索了它，而且我有点确定我正在做预期做的事情，但我仍然看到一个奇怪的行为。

事情是：

比方说，我有两个文本框，id 分别为 "title" 和 "author"。除此之外，我还有一个 onclick 触发咖啡脚本功能的按钮。

我的咖啡脚本函数如下所示：

check_fields = ->
  elem_book_title  = $("#title").val()
  elem_book_author = $("#author").val()
  alert(elem_book_title)
  alert(elem_book_author)
  if not elem_book_title? 
    alert("title is null")
  else if not elem_book_author?
    alert("author is null")
  else
    alert("both are ok")

情况是，如果我只在 "title" 文本框中输入内容，它应该提醒我 "author is null"。正确的？但令人惊讶的是，它提醒我 "both are ok".. 预期？或者我错过了什么？

Answer 1

在 jQuery 中，.val() 不会为空字段 return null（select 元素除外）。现在您的咖啡脚本评估为：

if (elem_book_title == null) {
  return alert("title is null");
} else if (elem_book_author == null) {
  return alert("author is null");
} else {
  return alert("both are ok");
}

所以尝试删除问号

if not elem_book_title
  alert("title is null")
else if not elem_book_author
  alert("author is null")
else
  alert("both are ok")

这将生成我认为您期望的 js（它正在测试空字符串、0 或 null 等虚假性）：

if (!elem_book_title) {
  return alert("title is null");
} else if (!elem_book_author) {
  return alert("author is null");
} else {
  return alert("both are ok");
}

有一个关于 coffeescript 的存在运算符 (?) 工作方式的问题 here 您可能会发现有用的信息（感谢 @raina77ow）。

Answer 2

您应该检查 "" (blank)，因为当文本框中没有输入任何值时，.val() 函数将 return "" .

你可以这样做：

check_fields = ->
  elem_book_title  = ""
  elem_book_author = "asdasd"

  if not elem_book_title? or  elem_book_title == "" 
    alert("title is null")
  else if not elem_book_author? or  elem_book_author == "" 
    alert("author is null")
  else
    alert("both are ok")

生成的JS

var check_fields;

check_fields = function() {
  var elem_book_author, elem_book_title;
  elem_book_title = "";
  elem_book_author = "asdasd";
  if ((elem_book_title == null) || elem_book_title === "") {
    return alert("title is null");
  } else if ((elem_book_author == null) || elem_book_author === "") {
    return alert("author is null");
  } else {
    return alert("both are ok");
  }
};

Answer 3

提示：在调试 if-not-else-if-not-else 时，我发现使用 unless 并在块中返回更容易遵循代码

return alert("title is null") unless elem_book_title
return alert("author is null") unless elem_book_author
alert("both are ok")

产生类似的JS

if (!elem_book_title) {
  return alert("title is null");
}
if (!elem_book_author) {
  return alert("author is null");
}
alert("both are ok");

如果在咖啡脚本中

if else in coffee script

javascript

jquery

coffeescript