使用JQuery快速实现Tab的AJAX动态载入(实例讲解)


Posted in Javascript onDecember 11, 2013

下面我就简单讲一下实现过程:

1.找到链接源,我这里是一串的Li下的链接

2.处理样式

3.当鼠标移过时载入链接源的网站到指定容器,并切换样式让点击事件返回false,这里不会应该点击到链接源网页

5.Over了.

脚本:

    {
    //homeNews
          var tid = "#homeNews";//removeTabBold
          var lvTabs = $(tid);
          if(lvTabs != null)
          {
            lvTabs.find("a").each(function(){$(this).click(function(){return false;});$(this).mouseover(function(){
removeTabBold(tid);$(this).addClass("bold");
$(this).parent().addClass("lvbg");
$('#HomeNewsList').load($(this).href());
return false;})});
          }
    }
    function removeTabBold(LvTabId)
    {
       $(LvTabId).find("a").each(function(){
$(this).removeClass("bold");
$(this).parent().removeClass("lvbg");
$(this).parent().parent().parent().removeClass("lvp");});
    }
Javascript 相关文章推荐
jquery1.4 教程二 ajax方法的改进
Feb 25 Javascript
js关闭模态窗口刷新父页面或跳转页面
Dec 13 Javascript
js导出table数据到excel即导出为EXCEL文档的方法
Oct 10 Javascript
jquery1.10给新增元素绑定事件的方法
Mar 06 Javascript
Linux下为Node.js程序配置MySQL或Oracle数据库的方法
Mar 19 Javascript
内容滑动切换效果jquery.hwSlide.js插件封装
Jul 07 Javascript
用Vue.js实现监听属性的变化
Nov 17 Javascript
使用jQuery实现两个div中按钮互换位置的实例代码
Sep 21 jQuery
深入理解Vue官方文档梳理之全局API
Nov 22 Javascript
基于Swiper实现移动端页面图片轮播效果
Dec 28 Javascript
jQuery中图片展示插件highslide.js的简单dom
Apr 22 jQuery
解决angularjs中同步执行http请求的方法
Aug 13 Javascript
jquery Tab效果和动态加载的简单实例
Dec 11 #Javascript
js为空或不是对象问题的快速解决方法
Dec 11 #Javascript
javascript获取xml节点的最大值(实现代码)
Dec 11 #Javascript
javascript弹出层输入框(示例代码)
Dec 11 #Javascript
深入理解javascript中defer的作用
Dec 11 #Javascript
如何实现修改密码时密码框显示保存到cookie的密码
Dec 10 #Javascript
JQuery页面的表格数据的增加与分页的实现
Dec 10 #Javascript
You might like
PHP 抓取新浪读书频道的小说并生成txt电子书的代码
2009/12/18 PHP
php生成静态页面的简单示例
2014/04/17 PHP
PHP开发Apache服务器配置
2015/07/15 PHP
php中ob函数缓冲机制深入理解
2015/08/03 PHP
PHP仿微信多图片预览上传实例代码
2016/09/13 PHP
PHP实现的字符串匹配算法示例【sunday算法】
2017/12/19 PHP
Laravel 修改默认日志文件名称和位置的例子
2019/10/17 PHP
如何在PHP中读写文件
2020/09/07 PHP
CheckBox 如何实现全选?
2006/06/23 Javascript
JQuery插件Style定制化方法的分析与比较
2012/05/03 Javascript
JQuery中Bind()事件用法分析
2015/05/05 Javascript
jquery单击事件和双击事件冲突解决方案
2016/03/02 Javascript
jquery实现简单的banner轮播效果【实例】
2016/03/30 Javascript
JavaScript比较当前时间是否在指定时间段内的方法
2016/08/02 Javascript
微信小程序 教程之数据绑定
2016/10/18 Javascript
完美解决手机浏览器顶部下拉出现网页源或刷新的问题
2017/11/30 Javascript
深入理解JavaScript 中的匿名函数((function() {})();)与变量的作用域
2018/08/28 Javascript
zepto.js 实时监听输入框的方法
2018/12/04 Javascript
jQuery AJAX与jQuery事件的分析讲解
2019/02/18 jQuery
vue-cli 3.x配置跨域代理的实现方法
2019/04/12 Javascript
layui添加动态菜单与选项卡
2019/07/26 Javascript
微信小程序swiper左右扩展各显示一半代码实例
2019/12/05 Javascript
python中zip()方法应用实例分析
2016/04/16 Python
使用Python脚本从文件读取数据代码实例
2020/01/19 Python
python根据用户需求输入想爬取的内容及页数爬取图片方法详解
2020/08/03 Python
在 Python 中使用 MQTT的方法
2020/08/18 Python
Python中用xlwt制作表格实例讲解
2020/11/05 Python
健身场所或家用健身设备:Life Fitness
2017/11/01 全球购物
蒙蒂塞罗商店:Monticello Shop
2018/11/25 全球购物
Rosetta Stone官方网站:语言学习
2019/01/05 全球购物
英国森林假期:Forest Holidays
2021/01/01 全球购物
介绍Java的内部类
2012/10/27 面试题
善意的谎言事例
2014/02/15 职场文书
2014年党课学习心得体会
2014/07/08 职场文书
信贷客户经理岗位职责
2015/04/09 职场文书
人与自然的观后感
2015/06/18 职场文书