时间戳

首页 > 解决方案 > 添加计算按钮以执行脚本

javascript - 添加计算按钮以执行脚本

问题描述

我有一段在页面加载时运行的脚本，但由于它在整个页面中使用的变量，我需要添加在命令上而不是在页面加载时自动运行脚本的能力。我是 javascript 新手，所以我不知道该怎么做

我找到了一些尝试过的脚本选项，但还没有让它们工作

        $('.cf-table-block').on('blur change', '.domain2Sum select, .domain3Sum, .domain4sum, .domain1sum, .achievementSum select', calcScore);

    function calcScore() {
    var s = (parseNumber($('.professionalSubtotal input').val()) * .90) + (parseNumber($('.achievementSubtotal input').val()) * .10);
    $('.teacherScore input').val((s).toFixed(2));
  }

  function parseNumber(n) {
    var f = parseFloat(n); //Convert to float number.
    return isNaN(f) ? 0 : f; //treat invalid input as 0;
  }

计算有效，但我只需要添加一个计算按钮即可随意执行计算。

标签： javascriptfunction

解决方案

在页面的某处添加一个按钮并在单击事件上调用该方法

<button type='button' id='calculate-button' onclick='calcScore()'>Calculate</button>

您也可以通过 jquery 将 click 事件添加到按钮（看起来您正在使用 jquery），但这应该让您朝着正确的方向开始。

要使用 jquery 做到这一点，您不会在标记中包含 onclick。相反，您可以使用jquery click 事件

$(function() {
  $('#calculate-button').click(function() { calcScore(); });
}

您需要将其添加到文档头部的脚本标记中。这依赖于文档范围内的“calcScore”方法，我们无法从您的代码片段中看出这一点。您还需要确保此脚本在另一个脚本之后。

推荐阅读