div全部可见在页面打开(尽管jquery，显示div在单选按钮点击)
提问于 2021-01-03 12:31:24
我试着做；当点击复选框单选按钮时显示div。我是用jquery实现的，但是当您加载页面时，我的所有div都是可见的。您必须单击我的第一个复选框单选按钮，以使其他div不可见。或者只需单击其他复选框单选按钮。
我试过了
#row2 {
display:none;}
但是当我将它添加到css中时，如果您单击第一个复选框单选按钮(与div row2相关) div是不可见的，而且它无法工作。
任何其他解决方案，当您打开页面时，我只希望看到选中的div (row2)。当页面加载时，我不想看到其他div。
谢谢..。
演示链接：https://rexin-demo.netlify.app/main.html
Ps:图片和按钮是不可见的jsfiddled，因为资产。最好通过演示链接查看它。
回答 1
Stack Overflow用户
回答已采纳
发布于 2021-01-03 12:43:55
通过在输入的单击事件末尾添加.filter(':checked').click()来触发单击。试试看
$(document).ready(function(){
$('input[type="radio"]').click(function(){
var inputValue = $(this).val(); // use .val() instead of .attr('value')
var targetBox = $("." + inputValue);
$(".box").not(targetBox).hide();
$(targetBox).show();
}).filter(':checked').click();
});另外，我更喜欢使用change而不是click来进行无线电和复选框输入。
$(document).ready(function(){
$('input[type="radio"]').on('change' ,function(){
if(this.checked){
var inputValue = $(this).val();
var targetBox = $("." + inputValue);
$(".box").not(targetBox).hide();
$(targetBox).show();
}
}).filter(':checked').prop('checked' , true).change();
});只有css才能使用的或
.box:not(.product){
display : none;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/65554621
复制相关文章
点击加载更多
腾讯云开发者
