时间戳

首页 > 解决方案 > 无法在 Windows 加载时调用 onchange 函数

javascript - 无法在 Windows 加载时调用 onchange 函数

问题描述

window.onload = function (){
    $("#work_sanctioned_year").change();
};
    
$(document).ready(function(){
    $("#work_sanctioned_year").change();
}); 
    
    $("#work-sanctioned-year").change(function(){
        var work_sanctioned_year = $(this).val();
        alert(work_sanctioned_year);
        $.ajax({
            url: 'get_data.php',
                    type: 'post',
                    data: {work_sanctioned_year:work_sanctioned_year},
                    dataType: 'json',
                    
                    success:function(response){
                    FusionCharts.ready();
                    }
        });
        FusionCharts.ready(function() {
  var dataChart = new FusionCharts({
      "type": "overlappedBar2d",
      "renderAt": "chart-5",
      "width": '100%',
      "height": '400',
      "dataFormat": "json",
      "dataSource": {
        "chart": {
          "caption": "Major League Baseball - Season Rankings",
          "subCaption": "Teams in the Lead",
          "xAxisName": "Team",
          "yAxisName": "Position",
          "theme": "fusion",
          "showValues": "0"
        },
        "categories": [{
            "labelFontSize": "13",
          "category": [{
            "label": "Boston Red Sox"
          }, {
            "label": "New York Yankees"
          }, {
            "label": "Tampa Bay Rays"
          }, {
            "label": "Toronto Blue Jays"
          }, {
            "label": "Baltimore Orioles"
          }, {
            "label": "Cleveland Indians"
          }, {
            "label": "Detroit Tigers"
          }, {
            "label": "Minnesota Twins"
          }, {
            "label": "Chicago White Sox"
          }, {
            "label": "Kansas City Royals"
          }, {
            "label": "Cleveland Indians"
          }, {
            "label": "Detroit Tigers"
          }, {
            "label": "Minnesota Twins"
          }, {
            "label": "Chicago White Sox"
          }]
        }],
        "dataset": [{
          "seriesname": "Matches",
          "data": [{
            "value": parseInt(document.getElementById("work_sanctioned").value)-4650
          }, {
            "value": "84"
          }, {
            "value": "86"
          }, {
            "value": "86"
          }, {
            "value": "85"
          }, {
            "value": "85"
          }, {
            "value": "88"
          }, {
            "value": "83"
          }, {
            "value": "86"
          }, {
            "value": "86"
          }, {
            "value": "85"
          }, {
            "value": "88"
          }, {
            "value": "83"
          }, {
            "value": "86"
          }]
        }, {
          "seriesname": "Wins",
          "data": [{
            "value": "57"
          }, {
            "value": "54"
          }, {
            "value": "42"
          }, {
            "value": "39"
          }, {
            "value": "24"
          }, {
            "value": "46"
          }, {
            "value": "38"
          }, {
            "value": "35"
          }, {
            "value": "29"
          }, {
            "value": "25"
          }, {
            "value": "46"
          }, {
            "value": "38"
          }, {
            "value": "35"
          }, {
            "value": "29"
          }, {
            "value": "25"
          }]
        }]
      }
    })
    .render();
});

    });

当我从下拉列表中选择某些东西时，它的工作。但是当我尝试做的是默认情况下使用第一个值调用函数时。我已经分别尝试了 window.onload 方法和 .ready 函数，但仍然没有调用函数..并且我在控制台中也没有得到与所以这使得在这里发现实际问题变得更加困难

标签： javascriptajax

解决方案

    <script>
    function work_sanctioned(){
        console.log('onchange');
        var work_sanctioned_year = $("#work-sanctioned-year").val();
        alert(work_sanctioned_year);
        $.ajax({
            url: 'get_data.php',
                    type: 'post',
                    data: {work_sanctioned_year:work_sanctioned_year},
                    dataType: 'json',
                    
                    success:function(response){
                    FusionCharts.ready();
                    }
        });
        FusionCharts.ready(function() {
  var dataChart = new FusionCharts({
      "type": "overlappedBar2d",
      "renderAt": "chart-5",
      "width": '100%',
      "height": '400',
      "dataFormat": "json",
      "dataSource": {
        "chart": {
          "caption": "Major League Baseball - Season Rankings",
          "subCaption": "Teams in the Lead",
          "xAxisName": "Team",
          "yAxisName": "Position",
          "theme": "fusion",
          "showValues": "0"
        },
        "categories": [{
            "labelFontSize": "13",
          "category": [{
            "label": "Boston Red Sox"
          }, {
            "label": "New York Yankees"
          }, {
            "label": "Tampa Bay Rays"
          }, {
            "label": "Toronto Blue Jays"
          }, {
            "label": "Baltimore Orioles"
          }, {
            "label": "Cleveland Indians"
          }, {
            "label": "Detroit Tigers"
          }, {
            "label": "Minnesota Twins"
          }, {
            "label": "Chicago White Sox"
          }, {
            "label": "Kansas City Royals"
          }, {
            "label": "Cleveland Indians"
          }, {
            "label": "Detroit Tigers"
          }, {
            "label": "Minnesota Twins"
          }, {
            "label": "Chicago White Sox"
          }]
        }],
        "dataset": [{
          "seriesname": "Matches",
          "data": [{
            "value": parseInt(document.getElementById("work_sanctioned").value)-4650
          }, {
            "value": "84"
          }, {
            "value": "86"
          }, {
            "value": "86"
          }, {
            "value": "85"
          }, {
            "value": "85"
          }, {
            "value": "88"
          }, {
            "value": "83"
          }, {
            "value": "86"
          }, {
            "value": "86"
          }, {
            "value": "85"
          }, {
            "value": "88"
          }, {
            "value": "83"
          }, {
            "value": "86"
          }]
        }, {
          "seriesname": "Wins",
          "data": [{
            "value": "57"
          }, {
            "value": "54"
          }, {
            "value": "42"
          }, {
            "value": "39"
          }, {
            "value": "24"
          }, {
            "value": "46"
          }, {
            "value": "38"
          }, {
            "value": "35"
          }, {
            "value": "29"
          }, {
            "value": "25"
          }, {
            "value": "46"
          }, {
            "value": "38"
          }, {
            "value": "35"
          }, {
            "value": "29"
          }, {
            "value": "25"
          }]
        }]
      }
    })
    .render();
});

    }
</script>

然后在 window.onload 以及 select 属性 onchange 上调用它

<select id="work-sanctioned-year" onChange="work_sanctioned()" style="max-width:40%;min-width:20%; margin:auto;">
        <option value="2019">2019</option>
        <option value="2020">2020</option>
        <option value="2021">2021</option>
        <option value="2022">2022</option>
        <option value="2023">2023</option>
    </select>

终于在 window.onload

  <script>
    window.onload = function (){
    
      work_sanctioned();
    };
    
    </script>

推荐阅读