简体   繁体   中英

Is it possible to pass an objects function to a buttons onClick event in Javascript?

This is the HTML

<form class='frm1'>
                <h2>Enter Loan Amount:</h2>
                <input type='text' name='Lamount' id='Lamount'>
                
                <h2>Enter Credit Score:</h2>
                <input type='text' name='Cscore' id='Cscore'><!-- comment -->
                
                <h2>Enter Estimated Property Taxes:</h2>
                <input type='text' name='Ptaxes' id='Ptaxes'><!-- comment -->
                
                <h2>Enter Estimated Monthly Mortgage Insurance:</h2>
                <input type='text' name='Minsurance' id='Minsurance'><!-- comment -->
                
                <h2>How many years will this loan be active?:</h2>
                <input type='text' name='Yactive' id='Yactive'>
                <br><br>
                
                <button id='btn1' onClick="loanCalculator.getIR()">Continue</button>

I tried using just the getIR() and it still didnt do what it is supposed to.

I've also tried wrapping the object in a function called getIR and storing the values inside of an array but when I tried alerting or writing the contents of the array all that printed was "object"

            </form>

This is the Javascript

loanCalculator = {
        loan_amt: document.getElementById('Lamount').value,
        c_score: document.getElementById('Cscore').value,
        p_taxes: document.getElementById('Ptaxes').value,
        m_insurance: document.getElementById('Minsurance').value,
        y_active: document.getElementById('Yactive').value,
        getIR: function(){
            if(c_score <= 500){
                alert("5% Interest Rate");
            }
            else if(c_score >=501 && c_score <600){
                alert("4.75% Interest Rate");
            }
            else if(c_score >=601 && c_score <700){
                alert("4.45% Interest Rate");
            }
            else{
                alert("4.25% Interest Rate");
            }
        }



    };

One of the examples is as follows.

 loanCalculator = { getIR: function() { const c_score = parseInt(document.getElementById('Cscore').value) if (c_score <= 500) { alert("5% Interest Rate"); } else if (c_score >= 501 && c_score < 600) { alert("4.75% Interest Rate"); } else if (c_score >= 601 && c_score < 700) { alert("4.45% Interest Rate"); } else { alert("4.25% Interest Rate"); } } };
 <h2>Enter Credit Score:</h2> <input type='text' name='Cscore' id='Cscore'><.-- comment --> <button id='btn1' onClick="loanCalculator.getIR()">Continue</button>

You need to execute document.getElementById(xxx).value every time after the button is clicked, so I guess you may don't need c_score: document.getElementById('Cscore').value . (This is off topic but please be careful about validation of input values.)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM