Question

我有以下输入：

<input type="text" name="country" />

当变量error 不为空时，我会在其后显示消息：

<input type="text" name="country" />
<span class="error">Some error message</span>

当变量error 为空时，我需要删除该消息。

所以我有以下内容：element 输入标记：

if (error != null) {
  var message = element.next("span.error");
  if (message == null)
    element.after("<span class='error'>" + error + "</span>");
  else
    error.text(error);
} else {
  element.next("span.error").remove();
}

但是，如果错误不为null，则永远不会添加消息。

我错过了什么？有没有办法改进我的代码？

Answer 1

更简单的方法：

if (error !== null) {
    $("span.error").text(error).show();        
} else {
    $("span.error").hide();
}

在上面的示例中，您将从页面上的错误span元素开始，但隐藏它。

<span class="error" style="display:none"></span>

话虽如此，我可以看到您的代码至少有一个问题。在这一行

error.text(error);

我相信你的意思

message.text(error);

此外，元素是从jquery选择器创建的变量吗？如果它只是对DOM元素的引用而不是jquery对象，那么您的代码将无效。

Answer 2

根据上面的评论，假设该元素是一个jquery对象，你的代码应该像这样修改时工作：

if (error != null) {
   var message = element.next("span.error");
   if (message.length == 0)
      element.after("<span class='error'>" + error + "</span>");
   else
      message.text(error);
} else {
   element.next("span.error").remove();
}

根据条件添加和删除html

2 个答案: