Question

我已经制作了一个菜单，其中包含8个启用/禁用javascript功能按钮，我使用相同的javascript代码来运行所有8个按钮，但使用不同的css类，这样我就可以让它们工作了。我的问题是如何让它们工作到你点击它们将起作用的地方。

Javascript代码：我使用此代码7次使用red1 red 2，因此on green1 green2依旧

// Left Menu function controls(className) {
if (className == "red") {
    document.getElementById('Skip').setAttribute('class','green');
    // You can define your play music statements here
} else {
    document.getElementById('Skip').setAttribute('class','red');
    // You can define your stop music statements here        
} }

if (className == "red1") { 
document.getElementById('Text').setAttribute('class','green1'); 
// You can define your play music statements here } else { 
document.getElementById('Text').setAttribute('class','red1'); 
// You can define your stop music statements here         } }

Css代码：所有8个按钮的相同代码.red1 .red2等.green1 .green2等。

.red { 
background: red; 
height: 30px;
width: 30px;
border-radius: 50px;
border: 1px solid #000;}                                                                                               

.green { 
background: green;
height: 30px;
width: 30px;
border-radius: 50px;
border: 1px solid #000;}

Html代码：

Skip &nbsp; <button id="Skip" class="red" onclick="controls(this.getAttribute('class'))">Play</button>

Text &nbsp; <button id="Text" class="red1" onclick="controls(this.getAttribute('class'))">Play</button>

以及另外6个具有相同代码的按钮red2 red3等等。

Answer 1

我认为你应该为你的按钮添加id，而id指的是你想要播放或停止的音乐。

多个javascript按钮（启用/禁用）

1 个答案: