Question

我试图使用简单的javascript字段验证器制作工资计算器。但是，当我添加条件if语句时，它们似乎相互抵消了。我不确定是否需要制作另一项功能来实现这一目标。

＆＃13;

function myFunction() {
    var rate = document.getElementById("payrate").value;
    var hours = document.getElementById("hours").value;
    var salary;


    salary = rate * hours;
    if (hours == ' '){
        alert("Fill hours");
    else if (payrate == ' '){
        alert("Fill payrate");
    }
}

if (salary < 20000) {
    salary = "The salary is too little";   
}else if(salary > 20000 && salary < 25000){
    salary = "Let's negotiate";
} else { 
    salary = "This good salary";
    document.getElementById("demo").innerHTML = salary;
}
}

＆＃13;

<p id="demo"></p>
Enter hourly Rate: <input type="text" id="payrate"><br>
Enter hours: <input type="text" id="hours"><br>
<input type="submit" value="Yearly Salary" onclick="myFunction()">

＆＃13;

Answer 1

这里有4个问题：

您的括号未正确关闭。
您声明变量名rate，但检查变量名称payrate。
你的逻辑不好。您应首先验证数据，然后进行计算。
应该更改检查空字符串的方式。检查空字符串（' '）时有空格。这会导致错误的结果。应该使用''代替。但是，我在我的代码中提出了另一种方法。

所以，新代码是：

function myFunction() {
    var rate = document.getElementById("payrate").value;
    var hours = document.getElementById("hours").value;
    var salary;

    // Validate data first
    if (!hours) {
        alert("Fill hours");

        // Stop the execution
        return false;
    } else if (!rate) {
        alert("Fill payrate");

        // Stop the execution
        return false;
    }
    salary = rate * hours;

    if (salary < 20000) {
        salary = "The salary is too little";
    } else if (salary > 20000 && salary < 25000) {
        salary = "Let's negotiate";
    } else {
        salary = "This good salary";
    }

    document.getElementById("demo").innerHTML = salary;
}

您可以在JsFiddle上进行测试。

Answer 2

您的括号未正确关闭。

试试这个：

function myFunction() {
var rate = document.getElementById("payrate").value;
var hours = document.getElementById("hours").value;
var salary;
salary = rate * hours;
if (hours == ' ') {
    alert("Fill hours");
}
else if (payrate == ' ') {
    alert("Fill payrate");
}
if (salary < 20000) {
    salary = "The salary is too little";   
} else if(salary > 20000 && salary < 25000){
    salary = "Let's negotiate";
} else { 
    salary = "This good salary";
}
document.getElementById("demo").innerHTML = salary;
}

Answer 3

你的逻辑很糟糕且括号未正确关闭试试这个：

function myFunction() {
var rate = document.getElementById("payrate").value;
var hours = document.getElementById("hours").value;
var salary;

salary = rate * hours;

//With out reurn false; the flow will still continue and return an value in the demo
   // and also check for if hours is a number

if (hours === '' || isNaN(hours)){
alert("Fill hours");
    return false;
}


//With out reurn false; the flow will still continue and return an value in the demo
   // and also check for if payrateis a number.

if (payrate === '' || isNaN(payrate) ){
alert("Fill payrate");
    return false;
}

 if (salary < 20000) {
 salary = "The salary is too little";   
}else if(salary > 20000 && salary < 25000){
  salary = "Let's negotiate";
  } else { 
 salary = "This good salary";
}
document.getElementById("demo").innerHTML = salary;
}

Answer 4

在'if'语句中，您有salary = "The salary is too little"之类的代码。也许你打算做console.log("The salary is too little")之类的事情？或者您可以使用警报而不是console.log。希望有效。

如何在javascript中显示警告框和innerHTML

4 个答案: