表单中有一个单选 ：
<input type="radio" name="price" value="100">100元
<input type="radio" name="price" value="200">200元
<input type="radio" name="price" value="500">500元
改写：
<div class="price-option" data-value="100" onclick="selectPrice(this)">100元</div>
<div class="price-option" data-value="200" onclick="selectPrice(this)">200元</div>
<div class="price-option" data-value="500" onclick="selectPrice(this)">500元</div>
<input type="hidden" id="selectedPrice" name="price">
<script>
function selectPrice(element) {
// 获取选中的值
var selectedValue = element.getAttribute('data-value');
// 设置隐藏的input的值
document.getElementById('selectedPrice').value = selectedValue;
// 可以在这里添加样式以显示选中状态
// 例如，添加一个类名来修改选中的div的样式
var priceOptions = document.querySelectorAll('.price-option');
priceOptions.forEach(function(option) {
option.classList.remove('selected');
});
element.classList.add('selected');
}
</script>
|
顶部 
加入收藏夹
2023-12-09 17:15:01 
已设置保密
回复
引用
报告
编辑
删除