我做这个原型是否正确？答案

【问题标题】：Am I doing this prototype correctly?我做这个原型是否正确？
【发布时间】：2023-03-16 00:36:01
【问题描述】：

如何让这两个警报调用弹出？我觉得我做对了，但由于某种原因，我的浏览器没有任何反应。我猜我不应该在同一行有onclick="isSalaryZeroOrLess();greaterThan()"，但我不太确定。我只想使用原型，以便我可以练习。我不想使用无聊的旧函数。

感谢您抽出宝贵时间阅读。

这是文件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>

这是文件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);

这是错误：

    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)

【问题讨论】：

Finance 是Class 的角色，因此您必须新建一个实例然后才能使用它。
我该怎么做？我不太确定如何开始:(

标签： javascript html css oop prototype

【解决方案1】：

从您的代码看来，您尚未创建财务对象。你可以这样做，然后它会起作用。

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

在你定义了greaterThan函数之后。然后在 onclick 中你可以做到这一点。

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

【讨论】：

感谢您的回复。我按照你说的做了，但是当我点击提交时，我的浏览器仍然没有响应（没有弹出警报）。
控制台没有错误，我只是看了一下。
等一下。 “没钱”警报有效。另一个警报没有。
我猜如果您的“没钱”有效，那么显然其他警报不会显示相同的工资值。
哦，好的，我明白了。看看我编辑的 gameTime.js 代码。为什么此代码不适用于“作品！”警报？我可以发誓会的。

【解决方案2】：

您没有在任何地方使用您的财务方法。首先，在某处初始化您的 Finance 对象。

var finance = new Finance(your_inputs);

更改按钮的 onclick

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

【讨论】：