我是一个初学者web开发人员,我有在JS检查数字的问题。
我的代码:
function checkValidateForm() {
let errorWidth = false;
let errorHeight = false;
let errorDepth = false;
if (parseFloat(cupboardMinWidth) <= parseFloat($('.product-size').val()) && parseFloat(cupboardMaxWidth) >= parseFloat($('.product-size').val())) {
errorWidth = false;
} else {
errorWidth = true;
}
if (parseFloat(cupboardMinHeight) <= parseFloat($('.product-height').val()) && parseFloat(cupboardMaxHeight) >= parseFloat($('.product-height').val())) {
errorHeight = false;
} else {
errorHeight = true;
}
if (parseFloat(cupboardMinDepth) <= parseFloat($('.product-depth').val()) && parseFloat(cupboardMaxDepth) >= parseFloat($('.product-depth').val())) {
errorDepth = false;
} else {
errorDepth = true;
}
if ($('.product-size').val() == "" || $('.product-height').val() == "" || $('.product-depth').val() == "" || errorWidth === true || errorHeight === true || errorDepth === true) {
$('.product-add-to-basket').attr("disabled", true);
if (errorWidth === true) {
$('.product-info-box1').html('Wymagana szerokość to: <b>' + cupboardMinWidth + 'cm -' + cupboardMaxWidth + 'cm </b><br/>');
$('.product-info-box1').fadeIn("slow");
} else {
$('.product-info-box1').fadeOut("slow");
}
if (errorHeight === true) {
$('.product-info-box2').html('Wymagana wysokość to: <b>' + cupboardMinHeight + 'cm -' + cupboardMaxHeight + 'cm </b><br/>');
$('.product-info-box2').fadeIn("slow");
} else {
$('.product-info-box2').fadeOut("slow");
}
if (errorDepth === true) {
$('.product-info-box3').html('Wymagana głębokość to: <b>' + cupboardMinDepth + 'cm -' + cupboardMaxDepth + 'cm </b><br/>');
$('.product-info-box3').fadeIn("slow");
} else {
$('.product-info-box3').fadeOut("slow");
}
$('.product-info-error-msg').fadeIn("slow");
} else {
$('.product-info-error-msg').fadeOut("slow");
$('.product-info-box1').hide;
$('.product-info-box2').hide;
$('.product-info-box3').hide;
$('.product-add-to-basket').attr("disabled", false);
}
}
let productId = 1;
let cupboardMinWidth = '100.00';
let cupboardMaxWidth = '250.00';
let cupboardMinHeight = '100.00';
let cupboardMaxHeight = '190.00';
let cupboardMinDepth = '140.00';
let cupboardMaxDepth = '190.00';
我的预览版:http://serwer1356363.home.pl/_nauka/
Wymagana szerokośćto: 100.00 to 250.00 to max width
Wymagana wysoko高度:100.00 to 190.00 to -maxść
Wymagana głębokośćto: 140.00ł190.00łmax
当我将值添加到我的输入中时,例如100.5、120.5等-尺寸信息并不总是隐藏的。
为什么?
当我的尺寸满足范围时-消息应该隐藏,但情况并不总是如此
我怎么才能修好它?
发布于 2020-07-27 20:37:08
当$('.product-size')为空时,它将被parseFloat($('.product-size').val())解析为NaN,并且将任何数字与NaN与任何运算符进行比较都会得到false,即使将NaN与NaN进行比较也会得到false。
我的建议是向输入添加事件,这样当用户更改值时,它们将被触发,您可以进行验证并显示您想要的消息。
const size = document.querySelector('.product-size');
size.addEventListener('change', (event) => {
console.log(event.target.value);
// You can add the condition here and show your message
})
https://stackoverflow.com/questions/63115139
复制相似问题