0
我試圖做一個顏色切換器，其中一個div的顏色根據您點擊的顏色的圓圈而改變。我有9種不同顏色的類「色圈」的div，我該如何做到這一點，以便當點擊div時它會返回特定的「背景」值？如何使用jquery返回單擊的div類的css屬性？
我試過使用「this」但它不工作，有沒有辦法做到這一點，而不必寫每個div的點擊功能？
感謝
$(".color-circle").click(function(){
$("#color-cont").css("background-color", $(this).css("background"));
})#colorPicker {
width: 100%;
height: 50px;
margin-top: 10px;
border: 1px solid #ccc;
\t border-radius: 3px;
display: inline-flex;
justify-content: center;
}
.color-circle {
border: 1px solid #ccc;
\t border-radius: 50%;
width: 40px;
height: 40px;
margin: auto;
}
.color-circle:nth-of-type(1) {
background: #DDC79B;
}
.color-circle:nth-of-type(2) {
background: #C7DD9B;
}
.color-circle:nth-of-type(3) {
background: #9BDD9B;
}
.color-circle:nth-of-type(4) {
background: #9BDDC7;
}
.color-circle:nth-of-type(5) {
background: #9BC7DD;
}
.color-circle:nth-of-type(6) {
background: #9B9BDD;
}
.color-circle:nth-of-type(7) {
background: #C79BDD;
}
.color-circle:nth-of-type(8) {
background: #DD9BC7;
}
.color-circle:nth-of-type(9) {
background: #DD9B9B;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<div id="color-cont">
<h3>Choose the theme color for your profile</h3>
<div id="colorPicker">
<div class="color-circle"></div>
<div class="color-circle"></div>
<div class="color-circle"></div>
<div class="color-circle"></div>
<div class="color-circle"></div>
<div class="color-circle"></div>
<div class="color-circle"></div>
<div class="color-circle"></div>
<div class="color-circle"></div>
</div>
</div>
'背景color'和'background'不匹配。選一個。 – epascarello