Question

我创建了一个JavaScript函数，在我们第一次访问网页时不起作用。它只能通过刷新页面或第二次访问它来工作。

即使我们第一次访问该页面，如何确保它仍然有效

以下是代码：

<script type="text/javascript">

    /*--adding/subtracting no. of seats and price-- */

    function calculateSeat()
    {      
        var nums = [document.getElementById('number_seat0').value, document.getElementById('number_seat1').value,document.getElementById('number_seat2').value,document.getElementById('number_seat3').value,document.getElementById('number_seat4').value];

        var num = 0;

        for (i=0; i < nums.length; i++) {
            num += +nums[i];
        }

        document.getElementById('total_seat').value = num;
        document.getElementById('total_amount').value = parseFloat(num * <?php echo $_SESSION['price'] ;?>).toFixed(2);
      };
</script>

Answer 1

检查以下示例

<script type="text/javascript">
    function calculateSeat() {

        // your php variables
        var phpPrice = parseInt('<?php echo $_SESSION['price'] ;?>');

        // shortcut
        var $byId = document.getElementById; //faster that querySelector

        // list of your DOM elements with ids
        var ids = ['number_seat0', 'number_seat1', 'number_seat2', 'number_seat3', 'number_seat4'];

        // function that will be used in [].reduce
        // to calculate your result
        function getSum(total, id) {
            return total + ( +$byId( id ).value );
        };

        // total number
        // Array.reduce docs: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce
        var result = ids.reduce(getSum);

        $byId('total_seat').value = result;
        $byId('total_amount').value = (result * phpPrice).toFixed(2);
    }
</script>

Answer 2

我实际上设法解决了这个问题，只需将脚本放在body标签的底部而不是头部（注意：以前的位置）。

onClick JavaScript在第一次访问时不起作用（页面访问）

2 个答案: