travelzen.js组件之【tab选项卡】
2018-07-16 13:57 更新
tab选项卡: travelzen.tabStrip
用于创建标题绑定内容切换的选项卡。
实例:
给容器设置一个选择器,最好是class类名,调用travelzen.tabStrip方法,传参。
- 必选参数trigger:选项卡的元素选择器,如下方代码中的".tabDemo"
- 必选参数data:用于装载选项卡标题以及对应内容的对象数组,每个项必须包含"name"和"content"两个键值对,其中,第一项的内容默认显示。
- 可选参数position:用于设置选项卡的位置,不设置时默认显示在顶部。可设置为"left"、"right"、"bottom"。
1.html
<div class="tabDemo"></div>
2.javascript
$(function(){
travelzen.tabStrip({
trigger: '.tabDemo',
data: [{
'name': '机票',
'content': '我是机票内容'
},{
'name': '酒店',
'content': '我是酒店内容'
}{
'name': '邮轮',
'content': '我是邮轮内容'
}]
})
})
以上内容是否对您有帮助:
更多建议: