JSFiddle - React, Tailwind, and code Playground
HTML
<div class="pay-way">付款方式
<div class="all type-1"><label>
<input type="radio" name="type" value="type-1" id="type_0" checked="checked" />
信用卡轉帳 手續費 元</label></div>
<div class="all type-2"><label>
<input type="radio" name="type" value="type-2" id="type_1" />
超商繳費 手續費 元</label></div>
<div class="all type-3"><label>
<input type="radio" name="type" value="type-3" id="type_1" />
ATM轉費 手續費 元</label></div>
<label>
<input type="radio" name="type" value="all" id="type_all" />
顯示全部</label>
</p>
JavaScript
$("input[name$='type']").click(function() {
var value = $(this).val();
if (value == 'type-1') {
$(".type-1").show();
$(".type-2").hide();
$(".type-3").hide();
}
else if (value == 'type-2') {
$(".type-1").hide();
$(".type-2").show();
$(".type-3").hide();
}
else if (value == 'type-3') {
$(".type-1").hide();
$(".type-2").hide();
$(".type-3").show();
}
else if (value == 'all') {
$(".all").show();
}
});
$(".type-1").show();
$(".type-2").show();
$(".type-3").show();