英文:
Changing textbox background color upon clicking out
问题
I'm trying to get the textbox background color to change on clicking out to rgb(137,200,46) if the input is correct and to rgb(B 231,0,100) if it's not, otherwise to stay white. The incorrect color shows up alright upon a wrong sequence, but I keep getting green even if the textbox is empty, instead of pink (since an empty textbox is incorrect, for this task). As an example, a correct input would be "79927398713" and I'm just typing "123" or leaving it empty to get an incorrect one. I tried both values !== ""
and values !== 0
, each as a &&
in the first if
and as an added if else
. I tried the same things with box
and integers
, but at this point I'm just grasping at straws. Could you please tell me where I'm going wrong? Please go easy on me, I'm still very rgb(137,200,46).
function checkLuhn(array) {
let nDigits = array.length;
let nSum = 0;
let isSecond = false;
for (let i = nDigits - 1; i >= 0; i--) {
let d = array[i] - '0';
if (isSecond == true)
d = d * 2;
nSum += parseInt(d / 10, 10);
nSum += d % 10;
isSecond = !isSecond;
}
return (nSum % 10 == 0);
}
function verify() {
var box = document.getElementById("cardBox");
const values = box.value.split("");
const integers = values.map((value) => parseInt(value.trim(), 10));
if ((checkLuhn(integers)) && (values !== ""))
{
box.style.background = "rgb(137,200,46)";
} else
{
box.style.background = "rgb(231,0,100)";
}
}
<!--Debit/Credit Card input; I set the type to password as an added layer of security-->
<label for="card" data-mlr-text>Card</label>
<input type="password" id="cardBox" placeholder="Write your Credit/Debit Card here" title="Write your Credit/Debit Card number" pattern="\d{10,19}" required onfocusout=verify()>
(Note: I've left out the code that doesn't require translation.)
英文:
I'm trying to get the textbox background color to change on clicking out to rgb(137,200,46) if the input is correct and to rgb(B 231,0,100) if it's not, otherwise to stay white. The incorrect color shows up alright upon a wrong sequence, but I keep getting green even if the textbox is empty, instead of pink (since an empty textbox is incorrect, for this task). As an example, a correct input would be "79927398713" and I'm just typing "123" or leaving it empty to get an incorrect one. I tried both values !== ""
and values !== 0
, each as a &&
in the first if
and as an added if else
. I tried the same things with box
and integers
, but at this point I'm just grasping at straws. Could you please tell me where I'm going wrong? Please go easy on me, I'm still very rgb(137,200,46).
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
function checkLuhn(array) {
let nDigits = array.length;
let nSum = 0;
let isSecond = false;
for (let i = nDigits - 1; i >= 0; i--) {
let d = array[i] - '0';
if (isSecond == true)
d = d * 2;
nSum += parseInt(d / 10, 10);
nSum += d % 10;
isSecond = !isSecond;
}
return (nSum % 10 == 0);
}
function verify() {
var box = document.getElementById("cardBox");
const values = box.value.split("");
const integers = values.map((value) => parseInt(value.trim(), 10));
if ((checkLuhn(integers)) && (values !== ""))
{
box.style.background = "rgb(137,200,46)";
} else
{
box.style.background = "rgb(231,0,100)";
}
}
<!-- language: lang-html -->
<!--Debit/Credit Card input; I set the type to password as an added layer of security-->
<label for="card" data-mlr-text>Card</label>
<input type="password" id="cardBox" placeholder="Write your Credit/Debit Card here" title="Write your Credit/Debit Card number" pattern="\d{10,19}" required onfocusout=verify()>
<!-- end snippet -->
答案1
得分: 0
看起来你试图检查一个包含字符串的数组。
values !== ""
其中values是一个数组,所以这将始终为真。
你需要检查 box.value !== "" 或更好的是 !box.value。
英文:
It looks like you are trying to check array with string.
values !== ""
Where values is array, so this will be always true.
You need to check box.value !== “” or better !box.value
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论