JavaScript 函数的返回值

3回答

侃侃尔雅

在您的 javascript 文件中，如果您创建一个名为 called 的变量total并将其放在方法之外，则您可以在每次运行 checkTotal 时更新该值。所以：var total;function checkTotal() {  var sum = 0;  for (i = 0; i < document.listForm.choice.length; i++) {    if (document.listForm.choice[i].checked) {      sum = sum + parseInt(document.listForm.choice[i].value);    }  }  total = sum;}function getTotal() {  return total;}然后在您的 html 中，您可以调用getTotal()，它将返回total设置的任何数字。

米琪卡哇伊

该函数传递哪个值？无，您的函数不会返回任何值，因此不会移交任何内容。但是，如果您想返回任何值，可以通过该return语句来实现。IE：function checkTotal() {  var sum = 0;  document.listForm.total.value = '';  for (i = 0; i < document.listForm.choice.length; i++) {    if (document.listForm.choice[i].checked) {      sum = sum + parseInt(document.listForm.choice[i].value);    }  }  document.listForm.total.value = sum;  return sum;}所以当你调用该函数时你可以保存它的返回值喜欢：var total = checkTotal();怎么称呼？目前它是使用事件侦听器属性来调用的。IE。onChange就像在 javascript 中这样做一样document.querySelectorAll('input[type="checkbox"]')    .forEach(function(){        this.addEventListener("change", checkTotal)    })如何在不破坏函数的情况下使 sum 成为全局变量？您只需var sum = 0;在全局范围内声明函数外部，如下所示var sum = 0; function checkTotal() {  sum = 0;  document.listForm.total.value = '';  for (i = 0; i < document.listForm.choice.length; i++) {    if (document.listForm.choice[i].checked) {      sum = sum + parseInt(document.listForm.choice[i].value);    }  }  document.listForm.total.value = sum;}javascript 中的任何函数也从其父函数继承作用域，因此在声明函数之前可用的任何内容也可以在函数内部使用（与 php 不同）。但需要注意的是：使用letand声明的变量const是块作用域的。含义：无法从其直接封闭的外部访问它们{...}将所有内容放在一起并纠正一些错误最终代码如下所示。超文本标记语言<!DOCTYPE html><html><head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <title>Document</title></head><body>    <form name="list-form">        <table>            <tr>                <td>A</td>                <td>Inhalt 1</td>                <td><input type="checkbox" name="Inhalt_1" value="1"></td>            </tr>            <tr>                <td>B</td>                <td>Inhalt 2</td>                <td><input type="checkbox" name="Inhalt_2" value="1"></td>            </tr>            <tr>                <td>Total:</td>                <td colspan="2"><input disabled type="text" id="total" name="total" value="0" /></td>            </tr>        </table>    </form>    <script src="path/to/your/js/file.js" type="text/javascript"></script></body></html>JSvar checkboxes = document.forms[0].querySelectorAll('input[type="checkbox"]'),    inpTotal = document.getElementById('total'),    sum = 0;// first we define the checkTotalfunction checkTotal() {    sum = 0;    checkboxes.forEach(el => {        if (el.checked) sum += +el.value;    });    inpTotal.value = sum;    // alert(sum);}// then we add the event listenerscheckboxes.forEach(el => el.addEventListener("change", checkTotal));PS：最好的做法是尽可能将所有 javascript 与 html 放在单独的文件中。

阿波罗的战车

尝试一下这个。我知道这有点复杂，但这是很好的做法我修复了您的非法 HTML 并将内联事件处理程序移至一个 eventListener我给了表单一个 ID，使用名称已过时且无用如果您打算提交表单，则需要重命名其中一个复选框，或者如果您在服务器上使用 PHP，则添加到[]名称以创建一个数组在这里，我重命名了它们，并给了它们一个用于选择器的类document.getElementById("listForm").addEventListener("input", function() {  let sum = 0;  const checked = [...this.querySelectorAll(".choice:checked")].map(inp => +inp.value); // get all values from checked and convert to number  if (checked.length > 0) sum = checked.reduce((a, b) => a + b); // sum them  console.log(sum)  document.getElementById("total").value = sum; // show value  document.getElementById("showwhen2").classList.toggle("hide", sum < 2); // unhide when >= 2});.hide {  display: none;}<form id="listForm">  <table>    <tbody>      <tr id="A" +>        <td>A</td>        <td>Inhalt 1</td>        <td><input type="checkbox" class="choice" name="choiceA" value="1" /></td>      </tr>      <tr>        <td id="B">B</td>        <td>Inhalt 2</td>        <td><input type="checkbox" class="choice" name="choiceB" value="1" /></td>      </tr>      <tr>        <td>Summe:</td>        <td><input disabled type="text" size="2" name="total" id="total" value="0" /></td>      </tr>    </tbody>  </table></form><div id="showwhen2" class="hide">Equal 2</div>