Jquery 复选框用“过滤”;只有";按钮

Jquery 复选框用“过滤”;只有";按钮,jquery,checkbox,Jquery,Checkbox,我在侧边栏中有6个复选框。页面加载时,它们已被选中 当您将鼠标悬停在每个复选框上时,右侧会出现一个“仅”链接 我有一个问题。当你点击“唯一”链接时,它会起作用,但当我去另一个复选框时,所有复选框都被取消选中,点击“唯一”链接时,它不会选中复选框 有什么建议吗 $('li')。悬停(函数(){ $(此)。附加(“”); $('li#only link')。单击(函数(e){ e、 预防默认值(); $('input:checkbox').not($(this.this('input:checkb

我在侧边栏中有6个复选框。页面加载时,它们已被选中

当您将鼠标悬停在每个复选框上时,右侧会出现一个“仅”链接

我有一个问题。当你点击“唯一”链接时,它会起作用,但当我去另一个复选框时,所有复选框都被取消选中,点击“唯一”链接时,它不会选中复选框

有什么建议吗

$('li')。悬停(函数(){
$(此)。附加(“”);
$('li#only link')。单击(函数(e){
e、 预防默认值();
$('input:checkbox').not($(this.this('input:checkbox')).prop('checked',false);
});
},函数(){
$(“#仅链接”).remove();
});


首先,取消选中此ul中的每个复选框。然后选中单击的li的复选框:

//为“#仅单击”元素添加事件侦听器
$(文档).on('单击','仅链接'),函数(e){
e、 预防默认值();
var,该值=$(此值);
//取消选中此ul中的每个复选框
最接近的('ul').find('input[type=“checkbox”]).prop('checked',false);
//选中此李的复选框
最接近的('li').children('input[type=“checkbox”]')).prop('checked',true);
});
//执行悬停处理
$('li')。悬停(函数(){
$(此)。附加(“”);
},函数(){
$(“#仅链接”).remove();
});
$(文档).on('change','input[type=“checkbox”]”,function(){
var thisUl=$(this).closest('ul');
var checkedNum=thisUl.find('input[type=“checkbox”]”)。过滤器(':checked')。长度;
如果(checkedNum==0){
toggleAllBtn(这是“show”);
}否则{
toggleAllBtn(thisUl,“隐藏”);
}
});
$(文档)。在('单击','全部',函数()上){
$(this).closest('ul').find('input[type=“checkbox”]”).prop('checked',true);
$(this.remove();
});
函数toggleAllBtn(此ul,模式){
if(此ul&模式){
var btn=$(“全部”);
开关(模式){
案例“展示”:
本附录(btn);
打破
“隐藏”案例:
thisUl.find(“#all”).remove();
打破
}
}
}


您只做了一些小的更改

$('li')。悬停(函数(){
$(此)。附加(“”);
$('li#only link')。单击(函数(e){
e、 预防默认值();
$('input:checkbox').prop('checked',true)。not($(this).SIBLINES('input:checkbox')).prop('checked',false);
});
},函数(){
$(“#仅链接”).remove();
});

$('li')。悬停(函数(){
$(此)。附加(“”);
$('li#only link')。单击(函数(e){
e、 预防默认值();
var ref=$(此);
$('input:checkbox').prop('checked',false);
ref.parent().find('input:checkbox').prop('checked',true);
});
},函数(){
$(“#仅链接”).remove();
});

$('li')。悬停(函数(){
$(此)。附加(“”);
$('li#only link')。单击(函数(e){
e、 预防默认值();
//取消选中全部。
$('input:checkbox').prop('checked',false);
//检查正确的一个。
$(this).sides('input:checkbox').prop('checked',true);
});
},函数(){
$(“#仅链接”).remove();
});


小提琴。希望能对你有所帮助。这是变化$('input:checkbox').prop('checked',true).not($(this).同胞('input:checkbox')).prop('checked',false);还有一件事。。。当有任何复选框未选中时,最好附加一个按钮“全部”再次选中所有复选框。如何做到这一点?