Question

我正在尝试使用jQuery在div容器中显示错误消息以进行验证。

因此，我想在验证失败的每个控件之后显示错误消息，而不是警告消息。

if (name == '' || email == '' || mobile == '' || password == '' || cpassword == '') {
var errName = document.getElementByID("name");
errName.innerHTML += "Please enter name";
errName.innerHTML += ".red {color:red;}";
document.getElementByID("name").val = errName;

有什么建议吗？

Answer 1

更纯粹的jQuery方法如下所示

jQuery代码

if (name == '' || email == '' || mobile == '' || password == '' || cpassword == '') {
   var errName = $("#name"); //Element selector
   errName.html("Please enter name"); // Put the message content inside div
   errName.addClass('error-msg'); //add a class to the element
}

CSS：

.error-msg{
   background-color: #FF0000;
}

<强>更新
您甚至可以在任何选择器上组合jQuery方法。每当我们在任何选择器上应用jQuery menthod时，它都返回一个＆＃34;这个＆＃34;指针，因此我们可以组合多个方法并使用单个语句将它们应用于选择器。这称为＆＃34;链接＆＃34;

在此处阅读更多内容：http://www.w3schools.com/jquery/jquery_chaining.asp

if (name == '' || email == '' || mobile == '' || password == '' || cpassword == '') {
       $("#name").html("Please enter name")
                 .addClass("error-msg"); // chained methods
    }

Answer 2

if (name == '' || email == '' || mobile == '' || password == '' || cpassword == '') {
   var errName = $("#name"); //get element by ID
   errName.append("Please enter name"); //append information to #name
   errName.attr("style", "background-color: red;"); //add a style attribute
}

编辑：或者你可以这样做：

if (name == '' || email == '' || mobile == '' || password == '' || cpassword == '') {
   var errName = $("#name"); //get element by ID
   errName.append("Please enter name"); //append information to #name
   errName.attr("class", "alert"); //add a class to the element
}

然后你将有一个.alert课程。这使您可以在CSS文件中使用此类。

.alert {
   background-color: #FF0000;
}

使用Jquery在div容器中显示错误消息以进行验证

2 个答案: