JSFiddle - React, Tailwind, and code Playground

by qichengzx

HTML

<div class="btn">
<button>按钮1</button>
<button>按钮2</button>
<button>按钮3</button>
</div>
<div class="div">
<div style="width:300px;height:30px;" data-bg="#f00">图像1 红色</div>
<div style="width:300px;height:30px;" data-bg="#0f0">图像2 绿色</div>
<div style="width:300px;height:30px;" data-bg="#00f">图像3 蓝色</div>
</div>

JavaScript

$(document).on('click','.btn button',function(){
    var $btn = $(this);
    var bg = $('.div>div').eq($btn.index()).data('bg');
    $('button').css('background-color','');//如果想在点击按钮的时候其他按钮恢复成默认，可以保留这行，否则可以删除
	$btn.css('background-color',bg);
})