[英]How to stop an alert message appending multiple times when using .each()
I'm using the JQuery .each() to grab all the values of a class called "required". 我正在使用JQuery .each()来获取名为“required”的类的所有值。 If any of these inputs are empty I want an alert message to pop up.
如果这些输入中的任何一个为空,我想要弹出一条警告消息。 It all works great.
这一切都很棒。 However, I am not happy with the way I have done the affect on the alert.
但是,我对我对警报产生影响的方式感到不满意。 I want to use the delay() and then slideUp.
我想使用delay()然后使用slideUp。 However, when using the delay() I get an alert message for every pass of the each.
但是,当使用delay()时,我会收到每个传递的警报消息。 I just want 1 alert when using the alert.
我只想在使用警报时发出1次警报。 I tried using appendTo() but that did not work.
我尝试使用appendTo()但是没有用。
What am I doing wrong ? 我究竟做错了什么 ?
$(document).ready(function () {
$("#quotation.btn").mousedown(function () { // THIS IS THE SUBMIT BUTTON OMN THE FORM
$(".required").each(function () { //HERE IS THE EACH
var required = $(this).val(); // WE GRAB THE VALUES OF THE "REQUIRED FIELDS"
if (required == "") { // IF ANY OF THE REQUIRED FIELDS ARE EMPTY WE EXECUTE THE FOLLOWING:
var message = '<p class="alert alert-danger" > You have Missed Off One or More Required Fields !</p>'
$("#collapseOne").collapse('show');
$("#collapseThree").collapse('hide');
// message.appendTo($("#alertMessage")).delay(5000).slideUp(500); // THIS DOES NOT WORK !
$("#alertMessage").append(message).slideUp(10000); // THIS DOES WORK SO LONG AS I DO NOT USE DELAY() !
$(this).css({"border": "solid 2px", "color": "#ff6666"})
}
else {
$(this).css({"border": "1px solid #ccc", "background-image": "none"})
}
})
});
});
You could simply set a variable within your conditional statement: 您只需在条件语句中设置变量:
if (required == "") {
showAlert = true;
}
Then outside of the each
statement you could check if you need to display the alert: 然后在
each
语句之外,您可以检查是否需要显示警报:
if (showAlert) {
$("#alertMessage").append(message).slideUp(10000);
showAlert = false;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.