使用jQuery从选择选项获取价值时出现问题

Question

您好，我坚持使用自己的代码，尝试使用其他解决方案，但该方法不起作用...

这是我的html代码：

<input type="date" name="tgl" value="">
<input onchange="hitung()" type="number" name="dewasa" value="0">
<input onchange="hitung()" type="number" name="anak" value="0">

<label> Hotel </label>
<div id="lh"></div>

<div id="hasil"></div>

我希望更改后的选项实时获得价值。 我尝试使用document.getElementById，但是它没有给我任何结果，我不知道为什么。可能是因为从函数window.addEventListener（'load'）function（）{....}

中显示了select选项。

注意：仅适用于输入名称dewasa和anak的“酒店选择”选项中的值没有结果

这是我的jquery代码：

jQuery(function ($){

    window.addEventListener('load', 
        function() {
            var htl = '<?php 
            $hotel = get_field('list_hotel');
            $hotels = explode(PHP_EOL, $hotel);
            echo '<select onchange="hitung()" id="hotel" name="hotel" class="wpcf7-form-control wpcf7-select" aria-invalid="false">';
            echo '<option value="0">Tanpa Hotel</option>';
            foreach ( $hotels as $hs ) {
                $h = explode('@', $hs);
                echo '<option value="'.$h[2].'">Hotel '.$h[0].' - Bintang '.$h[1].'</option>';
            }
            echo '</select>';?>';

            document.getElementById("lh").innerHTML = htl;
        }, true
    );


    function hitung() {
        var x = parseInt(document.getElementById("dws").value);
        var y = parseInt(document.getElementById("ank").value);
        var h = parseInt(document.getElementById("hotel").value);
        var v = '';
        var r = 'Rp ';

        var dewasa = "<?php echo get_field('harga_paket_dewasa')?>";
        var anak = "<?php echo get_field('harga_paket_anak')?>";

        v = x*parseInt(dewasa) + y*parseInt(anak) + parseInt(h);
        //v = x*parseInt(dewasa) + y*parseInt(anak);

        document.getElementById("hasil").innerHTML = v;
    }
    $("#dws").on("change", hitung);
    $("#ank").on("change", hitung);
    $("#hotel").on("change", hitung);
});