jq全选反选取消代码 jquery获取checkbox选中的值
用jq写tab，告别繁琐的循环和命名约定。基本原则:1.选中一个btn，将该btn的背景色设置为橙色，其他兄弟btn的背景色设置为空(无)2.如果子div的索引与btn的索引相同，则该div将被显示
用jq写tab，告别繁琐的循环和命名约定。
基本原则:
1.选中一个btn，将该btn的背景色设置为橙色，其他兄弟btn的背景色设置为空(无)
2.如果子div的索引与btn的索引相同，则该div将被显示，而其他兄弟div将被隐藏。
1).CSS函数参数2的回调函数方法；
2).原生get方法被转移到jq对象，然后被设置。
3).当前div使用show()方法，其他兄弟div使用hide()方法。
关键字:get() siblings() show() hide() css()
Html页面:
4个btn，4个分区
& ltdiv id = & # 8221wrap & # 8221& gt
& ltbutton & gtbtn1 & lt/button >
& ltbutton & gtbtn2 & lt/button >
& ltbutton & gtbtn3 & lt/button >
& ltbutton & gtbtn4 & lt/button >
& ltdiv & gt1 & lt/div >
& ltdiv & gt2 & lt/div >
& ltdiv & gt3 & lt/div >
& ltdiv & gt4 & lt/div >
& lt/div >
Css页面:
大盒子目前没有样式，需要在实际开发中指定宽度和高度；第一个btn背景色是橙色；显示第一个子div，隐藏其他兄弟div。
#换行部分{
宽度:300px
高度:200px
边框:1px纯红；
显示:无；
}
# wrap div:n-of-type(1){
显示:块；
/*第一个子项div显示*/
}
#wrap按钮:第n种类型(1) {
背景:橙色；
/*第一个btn的背景色是橙色；*/
}
Jquery页面:
1)首先将事件绑定到btn
$(“#wrap按钮”).单击(函数(){
//点击btn时发生的事件
})
关键词:click()；
2)点击btn时，将当前选中btn的颜色设置为橙色，将其他兄弟btn的背景颜色设置为空:
$(这个)。CSS(“背景”, “orange & # 8221).兄弟姐妹(“巴顿”).CSS(“背景”, “无”)
关键词:$(这个)；CSS()；siblings()
3)声明一个变量，它保存所选btn的下标
var $index = $(this)。index()；
关键词:$ index$(这个)；index()；
// 1:查找所有子div，设置css样式。如果一个DIV的索引和btn的索引一样，就让他显示。
$(“# wrap div & # 8221).CSS(“显示”，功能(一){
if (i == $index) {
return & # 8220block ”
}
return & # 8220无”；
})
关键词:CSS()；“显示”；i = = $ index
b:用get()方法将子div的索引与当前btn的索引绑定，然后将这个索引转换成jq对象，再用jq方法显示对应的div。
一个
$($(“# wrap div & # 8221).得到($(这个)。index()))。CSS(“显示”, “block & # 8221).兄弟姐妹(“div & # 8221).CSS(“显示”, “无”)
因为get方法是js的原生方法，所以应该将其转换成jq对象来使用jq方法。
关键词:$()；$(这个)。指数；get()；CSS()；siblings()
c:通过当前btn的索引绑定div的索引，然后显示该索引对应的div()，隐藏其余的div兄弟元素()。
$(“# wrap div & # 8221).eq($(这个)。index())。显示()。兄弟姐妹(“div & # 8221).hide()；
关键词:eq()；$(这个)。index()；show()；hide()
这样，你就用jQuery方法完成了选项卡的实现。
