Question

我有以下四个div：

<div id="air-trigger" onclick="getWidgetData('air-trigger'); getWidgetAirChart();"></div>
<div id="soil-trigger" onclick="getWidgetData('soil-trigger'); getWidgetSoilChart();"></div>
<div id="water-trigger" onclick="getWidgetData('water-trigger'); getWidgetWaterChart();"></div>
<div id="storage-trigger" onclick="getWidgetData('storage-trigger'); getWidgetStorageChart();"></div>

我在onclick事件下使用两个函数。 getWidgetData函数如下：

function getWidgetData(name){

    var curEl = document.getElementById('time-series');
    curEl.className = "active";

       widgetEl = document.getElementById("soil-chart");

       widgetEl4 = document.getElementById("air-chart");

       widgetEl5 = document.getElementById("water-chart");

       widgetEl6 = document.getElementById("storage-chart");

    //  alert(name);
        var el = document.getElementById('soil-chart');
        el.className = "";


        var el4 = document.getElementById('air-chart');
        el4.className = "";


        var el5 = document.getElementById('water-chart');
        el5.className = "";


        var el6 = document.getElementById('storage-chart');
        el6.className = "";

          if(name == 'air-trigger'){
            widgetEl4.innerHTML = document.getElementById('air-chart').outerHTML; 

                el4.className = "show active";
                el.className = "hide";
                el5.className = "hide";
                el6.className = "hide";

              }

          if(name == 'soil-trigger'){
          widgetEl.innerHTML = document.getElementById('soil-chart').outerHTML; 
            el.className = "show active";
            el4.className = "hide";
            el5.className = "hide";
            el6.className = "hide";
          }

          if(name == 'water-trigger') {

                 widgetEl5.innerHTML = document.getElementById('water-chart').outerHTML; 

                        el5.className = "show active";
                        el.className = "hide";
                        el4.className = "hide";
                        el6.className = "hide";
                  }


          if(name == 'storage-trigger'){
                 widgetEl6.innerHTML = document.getElementById('storage-chart').outerHTML; 

                    el6.className = "show active";
                    el.className = "hide";
                    el4.className = "hide";
                    el5.className = "hide";
                  }


    }

getWidgetAirChart（），getWidgetSoildChart（），getWidgetWaterChart（），getWIdgetStorageChart（）方法填充数据并在相应的div下显示图表。如果我选择＆＃34; water＆＃34;首先是tab，然后所有其他选项卡都没有使用onclick事件显示任何数据。但是，如果我使用＆＃34; water＆＃34;标签最后一切正常。我不明白为什么会发生这件事。请帮忙。提前到达。

html和javascript之间的不一致

0 个答案: