在按钮单击时更改变量的数据

Question

我试图通过不同的按钮单击来更改变量内部的数组，但我无法做到。 有什么办法我可以做到这一点。

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"> var chartdata = []; var eqdata = [['a',2],['b',6],['r',9],['s',8]]; var debdata = [['p',2],['r',6],['r',9],['d',8]]; var hybdata = [['l',2],['k',6],['rr',9],['df',8]]; function clicked(){ var id = event.srcElement.id if (id = 'eqty'){ return chartdata = eqdata; } else if (id = "debt"){ return chartdata = debdata; } else if (id = "hyb"){ return chartdata = hybdata; } }; </script> <div class="row" style="margin:auto; padding: 8px 8px 0" id="categories"> <button id="eqty" class="btn btn-primary" style='margin: 0 8px' onclick="clicked()">Equity Chart</button> <button id="debt" class="btn btn-primary" style='margin: 0 8px' onclick="clicked()">Debt Chart</button> <button id="hyb" class="btn btn-primary" style='margin: 0 8px' onclick="clicked()">Hybrid Chart</button> </div>

Answer 1

您的代码中有几个错误的地方：

1. 您不应该在导入脚本中编写脚本（第 1 行）
2. 你应该使用 es6 的 let 和 const 而不是 var
3. 在您的检查（第 9、11 和 13 行）中，您应该至少有一个双等号 == 来比较，一个等号用于分配值。

修复这些小东西你应该得到这样的结果：

<div class="row" style="margin:auto; padding: 8px 8px 0" id="categories">
<button id="eqty" class="btn btn-primary" style='margin: 0 8px' onclick="clicked()">Equity Chart</button>
<button id="debt" class="btn btn-primary" style='margin: 0 8px' onclick="clicked()">Debt Chart</button>
<button id="hyb" class="btn btn-primary" style='margin: 0 8px' onclick="clicked()">Hybrid Chart</button>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
    let chartdata = [];
    const eqdata = [['a',2],['b',6],['r',9],['s',8]];
    const debdata =  [['p',2],['r',6],['r',9],['d',8]];
    const hybdata =  [['l',2],['k',6],['rr',9],['df',8]];
    
    function clicked(){
        const id = event.srcElement.id
        if (id == 'eqty'){
            chartdata = eqdata;
        } else if (id == "debt"){
            chartdata = debdata;
        } else if (id == "hyb"){
            chartdata = hybdata;
        }
    };
</script>