简体   繁体   中英

Am I doing this prototype correctly?

How do I make these two alert calls pop up? I feel like I did it right but for some reason, nothing happens in my browser. I'm guessing I shouldn't have onclick="isSalaryZeroOrLess();greaterThan()" on the same line but I'm not so sure. I just want to use prototypes so I can get my practice in. I don't want to use boring old functions.

Thanks for taking the time to read.

Here is the file gameTime.html :

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>WOMP</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="gameTime.css">
</head>     
<body>
    <form class="col-md-4 col-md-offset-4" name="formHandler" id="handle">
        <div id="allFields">
            <div class="moveUsername">
                <h1>(All numbers inputted will be assumed that it's in dollars)</h1>
                <label for="usr">What's your annual salary?</label>
                <input type="field" class="form-control" id="salary" placeholder="What's your annual salary?" required="required">  
            </div>

            <div class="ageMovement">
                <label for="usr">How much do you spend every month on bills?</label>
                <input type="field" class="form-control" id="monthlyBills" name="ageChecker" placeholder="How much do you spend every month on bills?" required="required">
            </div>

            <div class="emailMovement">
                <label for="usr">How much do you spend when going out?</label>
                <input type="field" class="form-control" id="goingOut" name="emailChecker" placeholder="How much do you spend when going out?" required="required"> 
            </div> 
        </div>
        <button type="submit" class="btn btn-default" onclick="isSalaryZeroOrLess();greaterThan()">Submit</button>
    </form>
    <script type="text/javascript" src="gameTime.js"></script>
</body>
</html>

Here is the file gameTime.js :

 function Finance(salary, fixedExpense, variableExpense) {
    this.salary = salary;
    this.fixedExpense = fixedExpense;
    this.variableExpense = variableExpense;
    this.isSalaryZeroOrLess = function() {
        var s = parseInt(document.getElementById("salary").value);

        if(s <= 0) {
            alert("No money");
        }
    }
}



 Finance.prototype.greaterThan = function() {
    var s = parseInt(document.getElementById("salary").value);
    var userSalary = s / 12;

    if(userSalary > 30000) {
        alert("works!");
    }
}

var fin = new Finance(1000,1000,1000);

Here is the error:

    Uncaught ReferenceError: isSalaryZeroOrLess is not defined
    at HTMLButtonElement.onclick (gameTime.html:28)
gameTime.html:28 Uncaught ReferenceError: isSalaryZeroOrLess is not defined
    at HTMLButtonElement.onclick (gameTime.html:28)
gameTime.html:28 Uncaught ReferenceError: isSalaryZeroOrLess is not defined
    at HTMLButtonElement.onclick (gameTime.html:28)
gameTime.html:28 Uncaught ReferenceError: isSalaryZeroOrLess is not defined
    at HTMLButtonElement.onclick (gameTime.html:28)

You did not use your Finance method anywhere. First, initialize your Finance object somewhere.

var finance = new Finance(your_inputs);

Change the onclick of your button

<button type="submit" class="btn btn-default" onclick="finance.isSalaryZeroOrLess();finance.greaterThan()">Submit</button>

From your code it looks like you have not created an object of the Finance. You can do this then it will work.

  var fin = new Finance(1000,1000,1000);

After you have defined greaterThan function. Then in onclick you can do this.

    <button type="submit" class="btn btn-default" onclick="fin.isSalaryZeroOrLess();fin.greaterThan()">Submit</button>

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