Question

我尝试在Canvas中制作折线图，我在main.js中有一个main.html和脚本（不管是什么内部 - 我只会粘贴代码的结尾）。

这是main.js的结尾 - plot，plot2，plot3是绘制线条的函数。

document.getElementById("button").onclick = plot;  ///drawing line 1
document.getElementById("button2").onclick = plot2; //drawing line 2 
document.getElementById("button3").onclick = plot3; //drawing line 3 
document.getElementById("button4").onclick = plot4; //drawing .... 
document.getElementById("button5").onclick = plot5; //drawing ...

在main.html中我有

 <input type="submit" name="button" id="button" value="Rysuj" /></td>
<input type="submit" name="button2" id="button2" value="Rysuj2" /></td>
                   <input type="submit" name="button3" id="button3" value="Rysuj3" /></td>
                   <input type="submit" name="button4" id="button4" value="Rysuj4" /></td>
                   <input type="submit" name="button5" id="button5" value="Rysuj5" /></td>

当我按下按钮Rysuj，Rysuj2，Rysuj3都在画画时。

但是我想只做一个像'Rysuj'的按钮，我尝试在点击后更改ID，但是有些东西没有用。

在main.html中我写道：

  <script language="text/javascript">
function something(){
document.getElementById("button").id = "button2"


}
</script>
<input type="button" onclick="something()" value="Rysuj" id="button">

我应该做什么只做一个按钮，点击后将ID改为button2，然后点击按钮3等？

Answer 1

每次点击后如何更改第一个按钮的绘制线功能？

var arr = ['plot','plot2','plot3','plot4','plot5'];
var count=0;
document.getElementById("button").onclick = something;
function something(){
    eval(arr[count%arr.length]+'();');
    count++;
}

Answer 2

您可以设置计数器：

  <script language="text/javascript">
    var counter = 1;
    function something(){
       document.getElementById("button").id = "button" + counter;
       counter++;
    }
  </script>

并尝试将您的javascript代码和HTML分开。像onclick这样的内联js看起来不像很好的代码。

一个按钮，更改绘图ID

2 个答案: