Question

我对javaScript还是很陌生，所以我的代码可能有点错误。我想知道我如何拥有多个javaScript functions，它们实际上一个在另一个之下工作。因为我只能使用一个功能。

我不知道这是不是正确的布局，但是如果您能帮助我，我会非常感谢。

代码如下：

        window.addEventListener('load', function () {
        "use strict";    
         const l_form = document.getElementById('bookingForm');  
         l_form.onchange = calculateTotal;  


        function calculateTotal() {
            let l_totalPrice = 0;  

            const l_item = l_form.querySelectorAll('div.item');  
            const l_itemCount = l_item.length;  

            for (let t_i = 0; t_i < l_itemCount; t_i++) {

                  const t_item = l_item[t_i];  
                  const t_checkbox = t_item.querySelector('input[data-price][type=checkbox]');
                  if (t_checkbox.checked) {

                    l_totalPrice += parseFloat(t_checkbox.dataset.price);
                  }
            }
        l_form.total.value = l_totalPrice;

    }
     });

      window.addEventListener('load', function () {
      function enableBtn() {
        const getTermsChbk =  document.querySelector('termsChkbx');
        const getSubmit = document.querySelector('submit');
        if (getTermsChbk.checked) {
            text.style.color = "black";
            getSubmit.disabled = false;
        }
        else {
            getSubmit.disabled = true;
        }
      });

Answer 1

可以，但是出现语法错误。此处已修复：

window.addEventListener('load', function () {
    "use strict";


    const l_form = document.getElementById('bookingForm');
    l_form.onchange = calculateTotal;


    function calculateTotal() {
        let l_totalPrice = 0;

        const l_item = l_form.querySelectorAll('div.item');
        const l_itemCount = l_item.length;

        for (let t_i = 0; t_i < l_itemCount; t_i++) {

            const t_item = l_item[t_i];
            const t_checkbox = t_item.querySelector('input[data-price][type=checkbox]');
            if (t_checkbox.checked) {

                l_totalPrice += parseFloat(t_checkbox.dataset.price);
            }
        }
        l_form.total.value = l_totalPrice;

    }
});

window.addEventListener('load', function () {
    function enableBtn() {
        const getTermsChbk = document.querySelector('termsChkbx');
        const getSubmit = document.querySelector('submit');
        if (getTermsChbk.checked) {
            text.style.color = "black";
            getSubmit.disabled = false;
        } else {
            getSubmit.disabled = true;
        }
    }
});

但是您的enableBtn函数将永远无法从您在此处发布的内容运行。

Answer 2

花括号{}似乎是一个简单的问题。确保每个函数都是独立的且自包含的，变量在要使用它们的函数的范围之内，并确保函数返回某些内容（实际上在javascript中不是必需的，但肯定有助于调试）。希望这对您有所帮助，并祝您编程愉快！

我如何拥有多种功能？

2 个答案: