一个页面tab标签切换,都有scroll事件的解决办法
当前页有多个tab,如果都有scroll事件, 先解绑$(window).off('scroll') 再执行scroll就不可以了,多个标签就不会互相干扰;
给你们个例子:
//标签切换
$('.tab>a').on('click',function(){
$(this).addClass('Cur').siblings().removeClass('Cur');
$('.Content>div').eq($(this).index()).show().siblings().hide();
$(window).off('scroll'); //先解绑滚动事件,避免tab切换冲突
//标签1
if($(this).index()=="0"){
Load1(); //标签一执行的函数
}
//标签2
if($(this).index()=="1"){
Load2(); //标签二执行的函数
};
//标签3
if($(this).index()=="2"){
Load3(); //标签三执行的函数
};
});
没有深入研究更简单的写法,大家凑合着看,这都是我写东西遇到的问题,觉得当时比较费劲的,可能你们觉得没啥,so easy~~~ 万一有和我遇到同样问题的呢 ,也算是可参考
助人为乐,手留余香 哈哈~~~
一个页面tab标签切换,都有scroll事件的解决办法的更多相关文章
- Android ScrollView 嵌套 ListView、 ListView 嵌套ScrollView Scroll事件冲突解决办法
本人菜鸟一名,最近工作了,开始学习Android. 最近在做项目的时候,UX给了个design,大概就是下拉刷新的ListView中嵌套了ScrollView,而且还要在ScrollView中添加动画 ...
- JS特效之Tab标签切换
在我们平时浏览网站的时候,经常看到的特效有图片轮播.导航子菜单的隐藏.tab标签的切换等等.这段时间学习了JS后,开始要写出一些简单的特效.今天我也分享一个简单tab标签切换的例子.先附上代码: HT ...
- 每天一个JavaScript实例-tab标签切换
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- JS 实现 Tab标签切换功能
Tab标签切换 效果图: HTML部分: <div class="wrap"> <ul id="tag"> < ...
- Bootstrap——设置Tab标签切换
最近一个小项目需要用Tab标签切换显示不同div内容,用到了Bootstrap里面的东西,但是在Bootstrap3教程里却没有找到对应的代码,这里记录一下,方便以后快速查阅学习. 代码如下: < ...
- 网站开发,推荐使用SuperSlide 插件-Tab标签切换,图片滚动,无缝滚动,焦点图
SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新.网站上常用的“焦点图/幻灯片”“Tab标签切换”“图片滚动”“无缝滚动”等只需要一个SuperSlide即可解 ...
- jQuery蓝色修边tab标签切换
jQuery蓝色修边tab标签切换,jQuery,tab选项卡,标签切换,jQuery蓝色修边tab标签广告代码切换是一款非常简单实用tab选项卡切换效果,自己定义好相关的html标签即可,选项卡切换 ...
- javascript--获取一个页面各个标签的数量
获取一个页面各个标签的数量 document.getElementsByTagName('*')--获取所有的标签. var obj = document.getElementsByTagName(' ...
- Vue指令:v-for的用法;v-bind绑定class的几种写法;tab标签切换
一.v-for 的用法 循环指令,可以遍历 Number.String.Object.Array: 循环数字.字符串:有2个参数,分别是value和索引值: 循环对象:有3个参数,分别是 属性值.属性 ...
随机推荐
- c++中vector的pair与make_pair的使用,双关键字排序
#include <vector> #include <iostream> #include <algorithm> using namespace std; bo ...
- Oracle学习笔记之用户自定义函数
自定义函数语法格式: 用户自定义的函数,可以直接在sql语句中直接调用,并且任何一个funciton都必须有返回值,而且该函数声明后,是保存在数据端的,我们随时可以使用:注意:函数只能有一个返回值 ...
- HttpComponents 发送post get 请求
1.场景描述 使用Apache开源组织中的HttpComponents,完成对http服务器的访问功能. 2.HttpComponents项目的介绍 HttpComponents项目就是专门设计来简化 ...
- Nodejs.安装.非源码方式安装Node.js (Centos)
已验证的适用环境: Centos6.x 树莓派官方ROM(Raspbian) 先去官网下载已编译好的安装包 https://nodejs.org/en/download/current/ 以Cent ...
- 别指望一文读懂Java并发之从一个线程开始
Understanding concurrent programming is on the same order of difficulty as understanding object-orie ...
- ES6新特性之Symbol使用细节
在迭代器章节的时候出现过[Symbol.iterator ]的属性,那么到底Symbo到底是什么? 答:Symbol是ES6新定义的一种值,它既不是字符串,也不是对象,而是为javaScript增加的 ...
- 楼梯T-SQL:超越基础6级:使用CASE表达式和IIF函数
从他的楼梯到T-SQL DML,Gregory Larsen涵盖了更多的高级方面的T-SQL语言,如子查询. 有时您需要编写一个可以根据另一个表达式的评估返回不同的TSQL表达式的单个TSQL语句. ...
- CUDA C Best Practices Guide 在线教程学习笔记 Part 1
0. APOD过程 ● 评估.分析代码运行时间的组成,对瓶颈进行并行化设计.了解需求和约束条件,确定应用程序的加速性能改善的上限. ● 并行化.根据原来的代码,采用一些手段进行并行化,例如使用现有库, ...
- Java面试题解构
有次一个同事让我一同去面试一个候选人,没仔细看简历,所以在问了设计模式之后就让他谈一谈对内存泄漏和垃圾回收的理解,当时候选人一下子就懵了.后来才知道,他面的是初.中级开发职位,想来估计候选人心里也在骂 ...
- JavaScript系列----一切皆是对象
1.判断对象类型 1.1.typeof 运算符 首先要认识到,typepof是一个运算符,其运算需要一个参数,返回值是参数的类型. typeof使用方法 typeof parameter //使用方法 ...