/** * 当class为page的div,p,或者其他的非a标签包含href属性时 * 通过该插件自动的ajax包含的内容 * 当需要改变div的href属性时,需要手动的trigger触发hrefChange自定义事件 * $("#test").attr("href", "bee1314.iteye.com"); * $("#test").trigger("hrefChange") */ (function($) { // load content and you should be care context function load(context) { var nodeName = context.nodeName; var href = $(context).attr("href") console.log("nodeName=>" + nodeName + "; href=>" + href); if (nodeName != "a" && nodeName != "A" && href != "") { $(context).load(href); } } $(".page").each(function() { //load content load(this); //auto reload content when href changed var self = this; $(self).bind("hrefChange", function() { load(self); }) }) })(jQuery);
或许将href属性改成url属性更好,这样可以避开判断是不是a标签。
使用方式:
1. 添加class的属性为page,插件会根据page属性进行过滤查找
<!--该div中就会自动加载href链接的内容,是不是有iframe的赶脚-->
<div id="test" class="page" href="bee1314.iteye.com">
当需要改变href的链接时候:
$("#test").attr("href", "www.github.com")
$("#test").trigger("hrefChange"); //通过jQuery的自定义事件实现让插件帮助我们重新reload div内容。
相关推荐
<div>jQuery插件flyout弹出图片</div> <div id="biuuu"> <a href="iphone.jpg" title="jquery.flyout"><img src="iphone_small.jpg" alt="iphone" /></a> </div> 三,Javascript部分(jQuery插件jQuery Image ...
当我们在教程中演示 jQuery 时,会将函数直接添加到 <head> 部分中。不过,把它们放到一个单独的文件中会更好,就像这样(通过 src 属性来引用文件): 实例 <script type="text/javascript" src="jquery.js"> ...
[removed][removed][removed][removed][removed][removed]调用代码 你所需要做的所有事就是使用jQuery的方式选择一个元素并且调用插件。 $('a.myLinks').zoomimage(options); 可选项 一个哈希参数。所有的参数都是可...
以下是代码 分享给大家 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <title></title> <script src="Scripts/jquery-1.6.2....
史上效果最好的焦点图幻灯片jQuery插件Skippr,轻量级插件、...1.加载jQuery和插件 <link rel="stylesheet" href="css/jquery.skippr.css"> [removed][removed] [removed][removed] 2.HTML内容 <div id=
ColorPick.js是适用于现代网络的简单且最小的jQuery颜色选择器插件。 产品特点 最近使用的颜色会自动保存到本地存储中 整合简单 华丽的现代设计几乎适合所有网站 暗模式 用法 您可以克隆或处以zip格式下载最新版本...
页面加载完成后即可调用该插件,传入你想要效果的参数 $("#bar5").xq_navbar({ "type":"block", "liwidth":"avg", "bgcolor":"#000", "hcolor":["blue","rgb(10,100,100)","red","pink","green","rgba(23,234,22,1)...
link rel="stylesheet" href="jquery.wm-zoom-1.0.min.css"> [removed][removed] [removed][removed] Chamando o 插件 [removed] $(document).ready(function(){ $('.my-zoom').WMZoom(); }); [removed] O ...
插件描述:aos.js是一款效果超赞的页面滚动元素动画jQuery动画库插件。该动画库可以在页面滚动时提供28种不同的元素动画效果,以及多种easing效果。在页面往回滚动时,元素会恢复到原来的状态。 简要教程 aos.js是一...
一个Leaflet插件,用于使用 API将天气小部件添加到地图 请参阅(当前正在运行。请参见下面的消息)。 重要说明: OpenWeatherMap API现在要求您获取API密钥。 因此,该插件不再起作用。 我正在进行更新,以为此插件...
//初始化分页插件 function initPage() { ias = jQuery.ias({ history: false, container: ".content",// 文章列表上一级容器 item: ".excerpt",// 文章列表的类 pagination: ".pagination",// 分页导航父级...
-简单方便,示例可以参考 default.aspx 或者 other\accordion_tree_run.aspx。 +2009-08-14 v2.0.6 -动态生成菜单实例(other\menu_dynamic_run.aspx和other\menu_dynamic2_run.aspx)(feedback:shguo)。 -...
-Button控件将不再自动拥有display:inline属性,如果希望两个按钮在一行显示,请为第一个按钮设置CssStyle="float:left;"属性。 -修正了弹出菜单的位置在Firefox下不正确的BUG(feedback:eroach)。 -为TriggerBox...
Ipush 是有大陆仔仔开发的一套基于jQuery 的JS轮播程序,他完全符合当前流行的响应式设计,可跨平台使用。同时,在移动端还可以支持单指触发事件切换播放顺序。 该插件功能强大,可以支持三种播放形式调用: 极简...