简单的 Javascript Onblur If else 函数

Question

这是我自学 javascript 的第一周，我遇到了一个问题。

我正在尝试创建一个简单的抵押贷款“贷款价值”计算器。我的计算器工作正常，但我正在尝试为我的两个表单字段之一设置最小值验证。

这是页面的链接

链接

我的代码在下面

function calculate (form) {
    var propVal = form.propertyValue.value; var loanAmt =
    form.mortgageAmount.value; var type = form.mortgageType.value;

    var ltv = loanAmt / propVal * 100 ;

    var roundedLtv = Math.floor(ltv);

    if ( type === "First Time Buyer" && roundedLtv <= 91 )  {   
        document.getElementById("result").innerHTML= ("Your loan to value is: <b>" + (roundedLtv) + "%</b> <br /> We can help place your mortgage");
    }
    else if ( type === "Moving Home" && roundedLtv <= 91 )  {   
        document.getElementById("result").innerHTML= ("Your loan to value is: <b>" + (roundedLtv) + "%</b> <br /> We can help place your mortgage");
    }
    else if ( type === "Remortgage" && roundedLtv <= 86 )  {    
        document.getElementById("result").innerHTML= ("Your loan to value is: <b>" + (roundedLtv) + "%</b> <br /> We can help place your mortgage");
    }
    else if ( type === "Buy To Let Purchase" && roundedLtv <= 81 )  {   
        document.getElementById("result").innerHTML= ("Your loan to value is: <b>" + (roundedLtv) + "%</b> <br /> We can help place your mortgage");
    }
    else if ( type === "Buy To Let Remortgage" && roundedLtv <= 76 )  {     
        document.getElementById("result").innerHTML= ("Your loan to value is: <b>" + (roundedLtv) + "%</b> <br /> We can help place your mortgage");   
    }
    else 
    {       
        document.getElementById("result").innerHTML= ("Your loan to value is: <b>" + (roundedLtv) + "%</b> <br /> Unfortunatly we cannot help you place a mortgage");    
    }
}

一切正常，直到这一点，我正在尝试提醒用户贷款金额需要大于 45000。在下面的 HTML 中，您将看到我正在尝试使用 onBlur 函数

function loancheck (propVal,loanAmt,form) {      
    if (loanAmt >= 45000) {
        document.getElementById("val1").innerHTML= ("Thank You"); 
    }
    else   
    {       
         document.getElementById("val1").innerHTML= ("Higher");   
    }
} 

这是与之配套的 html

<form name="myform" ACTION="" METHOD="GET"> Mortgage Type 
    <select name="mortgageType"> 
        <option>First Time Buyer</option> 
        <option>Moving Home</option> 
        <option>Remortgage</option> 
        <option>Buy To Let Purchase</option> 
        <option>Buy To Let Remortgage</option> 
     </select> 

     <br /> 
     Value <input name="propertyValue" type="text" value=""/><br />

     Mortgage Amount <input name="mortgageAmount" type="text" value="" onBlur="loancheck(this.value)" />

     <p id="val1"></p>

     <INPUT TYPE="button" NAME="button" Value="Click" onClick="calculate(this.form)">
</form> 

<br /><br /> 
<p id="result"> </p>

我确信我正在做一些根本错误的事情，但如果有人可以指出我将非常感激。

Answer 1

当调用 loancheck 时，变量 loanAmt 未定义，因为没有足够的参数传递给函数。考虑通过以下方式清理函数定义：

function loancheck (loanAmt) { // remove unused parameters
    var userAlert = document.getElementById("val1") // don't repeat yourself
    if (loanAmt >= 45000) { 
        userAlert.innerHTML= "Thank You"; // remove extraneous parens
    } else { 
        userAlert.innerHTML= "Higher";
    }
}

Answer 2

当您调用 loancheck 时，您会执行以下操作：

loancheck(this.value)

但是，loancheck 需要三个参数：

function loancheck (propVal,loanAmt,form) 

由于 loanAmt 是 calculate 函数，您需要先调用calculate，然后返回loanAmt。或者，将 loanAmt 设为全局变量，并在用户更改相应字段时更新它。

Answer 3

你没有说实际发生了什么:)
但我发现你的贷款检查函数需要 3 个变量。您的 onblur 处理程序传递一个变量，但您的函数期望第二个变量“loanAmt”在那里。有道理吗？

Answer 4

您在onBlur 中调用loancheck(this.value)

但您的函数定义有loancheck (propVal,loanAmt,form)。

您正在传递一个值，该值会复制到 proVal。

loadnAmt、form 未定义。