尝试创建一个 function，它将基于随机十六进制数在两个不同的 HTML 元素中更改为相同的背景颜色

Question

Hello I am a junior at programming: I am trying to change background color to same color for two different HTML sections and I get two different colors although I have tried to select by class or by ID to the elements but always getting two different background colors . 我相信我的 function 生成颜色运行了两次，我怎样才能让它只运行一次并将相同的颜色应用于所有其他功能？ 非常感谢您的帮助。

HTML

<h2>Overalls</h2>
<button class="button2" type="button" id="chOver"><span>Change Color</span></button> <img class="testo" id="overalls" src="img/overalls.png">
<div id="crazyDiv">
   <h1 class="testo" id="colorsp">#000000</h1>
</div>

Java 脚本

//overalls
let buttonSweet = document.getElementById("chOver")
    .addEventListener("click", buttonClick);

function buttonClick() {
    const randHex = Math.floor(Math.random() * 16777215).toString(16);
    document.getElementById('colorsp').innerHTML = "#" + randHex;
    return '#' + randHex;
}

let overallSweet = document.getElementById("chOver")
    .addEventListener("click", changeColOver);

function changeColOver() {
    $("#overalls").css("background-color", buttonClick);
}

let boxSweet = document.getElementById("chOver")
    .addEventListener("click", changeBoxCol);

function changeBoxCol() {
    $("#colorsp").css("background-color", buttonClick);
}

Answer 1

也许这可以解决问题

 function buttonClick() { const randHex = Math.floor(Math.random() * 16777215).toString(16); const generatedColor = '#' + randHex; document.getElementById('colorsp').innerHTML = generatedColor; $("#overalls").css("background-color", generatedColor); $("#colorsp").css("background-color", generatedColor); } document.getElementById("chOver").addEventListener("click", buttonClick);

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <h2>Overalls</h2> <button class="button2" type="button" id="chOver"><span>Change Color</span></button> <img class="testo" id="overalls" src="img/overalls.png"> <div id="crazyDiv"> <h1 class="testo" id="colorsp">#000000</h1> </div>

编辑 1：当您向按钮添加了两次listener器时，它会出现。