方法一: 通过img标签内的onerror事件来设置 以上两种写法任选一种即可 方法二:推荐 利用error事件捕获来处理(全局判断,动态添加的元素也可以...function (e) { var elem = e.target; if (elem.tagName.toLowerCase() == 'img') { elem.src = "http://默认图片地址
2:实现的方法二: (a):导入jquery.easyui.min.js和jquery.min.js这两个文件,以及theme这个文件; (b):创建一个html页面,源码如下所示: 1 <!...三:分类空间允许用户使用多面板,但在同一时间只会显示一个。每个面板都内建支持展开和折叠功能。点击一个面板的标题将会展开或折叠面板主体。...用户可以定义一个被默认选中的面板,如果未指定,那么第一个面板就是默认的。 1 <!...web页面时触发 46 $(document).ready(function(){ 47 //$('selector').plugin('method', parameter...六:该分页控件允许用户导航页面的数据。它支持页面导航和页面长度选择的选项设置。用户可以在分页控件上添加自定义按钮,以增强其功能。 1 <!
回到顶部按钮 预加载图片 检查图片是否加载完毕 自动修复损坏的图片 Hover 上的 Class 开关 禁用 input 字段 停止链接加载 淡入淡出/滑动开关 简单的折叠效果 将两个 Div 设为相同高度...预加载图片 如果你的页面使用了大量不能初始可见的图片(例如绑定在 hover 上),预加载它们是十分有用的: $.preloadImages = function () { for...Hover 上的 Class 切换 如果用户的鼠标悬停在页面上某个可点击元素时,你想要改变这个元素的视觉表现。...$('input[type="submit"]').prop('disabled', false); 停止链接加载 有时你不想链接跳转到某个页面或重加载该页面,而希望可以做一些其他事情...但如果想让该元素在第一次点击时显现,第二次点击时消失,下面的代码可以很好地完成这个工作: // Fade $('.btn').click(function () { $('.element').fadeToggle
前言 折叠(Collapse)插件可以很容易地让页面区域折叠起来。如果您想要单独引用该插件的功能,那么您需要引用 collapse.js, bootstrap已经包含了这个插件。...该data-target属性接受一个 CSS 选择器来应用折叠。确保将类添加collapse到可折叠元素。如果您希望它默认打开,请添加附加类in。 <!...在可折叠元素实际显示之前(即在事件发生之前)返回给调用者。shown.bs.collapse .collapse(‘hide’) 隐藏可折叠元素。...在可折叠元素实际被隐藏之前(即在事件发生之前)返回给调用者。hidden.bs.collapse Bootstrap 的折叠类公开了一些用于挂钩折叠功能的事件。...事件类型 描述 show.bs.collapse show调用实例方法时立即触发此事件。 shown.bs.collapse 当折叠元素对用户可见时触发此事件(将等待 CSS 转换完成)。
Horizontal accordion: jQuery 基于jQuery开发,非常简单的水平方向折叠控件。...BetterTip jQuery plugin: Accordion 用于创建 折叠菜单的jQuery插件。...jQchart Accordion Menu script 基于jQuery开发的可折叠菜单。...能够触一些事件,因此可以在图片加载时执行一些动作。 Galleria jGrow jGrow这个jQuery插件能够让textarea根据文本的长度自动调整它的大小。...这个jQuery slideshow可以设置当页面打开时自动播放图片并能够将最近查看的图片存储在cookie中。
-- 需要进行权限控制的页面访问,使用默认的类和默认的方法,默认的类和默认的方法可以不用写,这里写出来为了强调 --> <action name="page_*_*" class="com.opensymphony.xwork2...<em>在</em>jsp<em>页面</em>中引入<em>jQuery</em> EasyUI相关的资源文件 示例代码如下: <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath...3.2、<em>accordion</em> <em>折叠</em>面板 详解如下: 通过 $.fn.<em>accordion</em>.defaults 重写<em>默认</em>的 defaults。 ...<em>折叠</em>面板(<em>accordion</em>)允许您提供多个面板(panel),同时显示一个或多个面板(panel)。 每个面板(panel)都有展开和<em>折叠</em>的内建支持。...点击面板(panel)头部可展开或<em>折叠</em>面板(panel)主体。 面板(panel)内容可通过 ajax 指定 'href' 属性来<em>加载</em>。用户可定义被选中的面板(panel)。
for jQuery Accordion is a part of easyui framework for jQuery....1.2 参数 1.2.1 容器参数 参数名称 参数类型 描述 默认值 width 数字 可折叠标签的宽度。 auto height 数字 可折叠标签的高度。...true 1.2.2 面板参数 可折叠标签面板继承自面板(panel),许多属性定义在标签里,下面的属性就是如此: 参数名称 参数类型 描述 默认值 selected 布尔 设置可折叠标签中默认展开的标签页...在输入框组件后显示的标签 Of {pages} displayMsg 字符串 显示一个页面的信息。...href 字符串 一个远程的URL加载数据,然后显示在面板中 null loadingMessage 字符串 当加载远程数据时,在面板中显示的信息 Loading… 10.3 事件 名字 参数 描述
3-1 拖曳插件——draggable 3-2 放置插件——droppable 3-3 拖曳排序插件——sortable 3-4 面板折叠插件——accordion 3-5 选项卡插件——tabs...]) 参数url为加载服务器地址,可选项data参数为请求时发送的数据,callback参数为数据请求成功后,执行的回调函数 例如,点击“加载”按钮时,向服务器请求加载一个指定页面的内容,加载成功后,将数据内容显示在...为服务器返回的数据类型,success为请求成功的执行的回调函数,type为发送数据请求的方式,默认为get 例如,点击页面中的“加载”按钮,调用ajax()方法向服务器请求加载一个txt文件,当请求成功时调用..., 例如,在页面中,通过加载sortable插件将元素中的各个表项实现拖曳排序的功能,如下图所示: 在浏览器中显示的效果: 3-4面板折叠插件——accordion 面板折叠插件可以实现页面中指定区域类似...“手风琴”的折叠效果,即点击标题时展开内容,再点另一标题时,关闭已展开的内容,调用格式如下: $(selector).accordion({options}); 其中,参数selector为整个面板元素
5、悬停切换类 假设你希望当用户将鼠标悬停在可点击的元素上时,它会改变颜色。...有时候,你既不需要链接到某个特定的网页,也不想要重新加载页面——你可能希望链接做点别的事情,例如说触发一些其他脚本。...这就要在阻止默认动作上做文章了: $('a.no-link').click(function (e) { e.preventDefault(); }); 8、淡入/滑动切换 滑动和淡入都是我们用jQuery...').find('.content').hide(); // Accordion $('#accordion').find('.accordion-header').click(function (...next.slideToggle('fast'); $('.content').not(next).slideUp('fast'); return false; }); 通过添加这个脚本,你真正需要做的仅仅是在页面上添加必要的
但是在一个时间内,它只能限制你的页面用户只能展开其中的一个部分, 每一个 Accordion 控件包括若干个 AccordionPane 控件,AccordionPane 控件可以象 Panel 控件一样...Accordion 控件具有保持其选中状态的功能,当页面发生提交的过程后,Accordion 保留其提交前选中的页面。...在开发中,我们可以在这里将每一个 AccordionPane 的标题默认 Css 样式设置与此,另外还可以为每一个 AccordionPane 单独指定其 Css 样式。...在开发中,我们可以在这里将每一个 AccordionPane 的标题默认 Css 样式设置与此,另外还可以为每一个 AccordionPane 单独指定其 Css 样式。...在开发中,我们可以在这里将每一个 AccordionPane 的标题默认 Css 样式设置与此,另外还可以为每一个 AccordionPane 单独指定其 Css 样式。
实现布局: $('body').layout({applyDefaultStyles: true }); 【】jQuery UI实现折叠菜单 (1)引入jquery UI插件 (2)定义折叠菜单: 使用div定义折叠区域: <a href...使用jQuery UI实现折叠菜单: $('#accordion').accordion(); 【】使用jquery UI实现Tab显示 (1)引入jQuery UI <!...在页面的ready函数里使用ajaxForm来给你页面上的表单做这些AJAX提交的准备工作。 ajaxForm 需要零个或一个参数。这唯一的一个参数可以是一个回调函数或者是一个可选参数对象。...这个用在表单里有file域要上传文件时。更多信息请参考 代码示例 页面里的File Uploads 文档。
要通过JQuery触发下拉插件,你需要使用方法dropdown(); $().dropdown('toggle'); 在页面加载后,我们可以使用这个方法把下拉插件的从关闭状态切换到开启状态。...你可以看到,我在调用了.myDropdownHandle之后,使用了dropdown()方法。下拉插件的默认状态是关闭的;然而你刷新页面后它将切换状态并使菜单可见。...我已经写了下面的JQuery代码片段去监听所有的下拉插件状态,并打印每个事件触发时的状态。 <!...它还应该有一个自定义属性data-ride,它告诉Bootstrap在页面加载时就可以启动滑动效果。如果没有这个属性,在您第一次手动操作之前,幻灯片将不会自动更改。...Bootstrap模式对话框有一个选项,当单击该句柄时,将该链接加载到它的modal-body元素中。这个特性在默认情况下是关闭的。
预加载图片 如果你的页面中使用了很多不可见的图片(如:hover 显示),你可能需要预加载它们: $.preloadImages = function () { for (var i = 0; i...你可以把 img 替换为其他的 ID 或者 class 来检查指定图片是否加载完成。...鼠标悬停(hover)切换 class 属性 假如当用户鼠标悬停在一个可点击的元素上时,你希望改变其效果,下面这段代码可以在其悬停在元素上时添加 class 属性,当用户鼠标离开时,则自动取消该 class...并把要移除的属性作为参数传入: $('input[type="submit"]').removeAttr('disabled'); 阻止链接加载 有时你不希望链接到某个页面或者重新加载它,你可能希望它来做一些其他事情或者触发一些其他脚本...').find('.content').hide(); // Accordion $('#accordion').find('.accordion-header').click(function ()
检测浏览器 注: 在版本jQuery 1.4中,.support 替换掉了.browser 变量 $(document).ready(function() { // Target Firefox 2 and...-- Create an anchor tag -->Back to top 12.预加载图片 如果你的页面中使用了很多不可见的图片(如:hover...你希望改变其效果,下面这段代码可以在其悬停在元素上时添加 class 属性,当用户鼠标离开时,则自动取消该 class 属性: $('.btn').hover(function () { $(this...: $('input[type="submit"]').removeAttr('disabled'); 17.阻止链接加载 有时你不希望链接到某个页面或者重新加载它,你可能希望它来做一些其他事情或者触发一些其他脚本...').find('.content').hide(); // Accordion $('#accordion').find('.accordion-header').click(function ()
检测浏览器 注: 在版本jQuery 1.4中,$.support 替换掉了$.browser 变量 $(document).ready(function() { // Target Firefox...12.预加载图片 如果你的页面中使用了很多不可见的图片(如:hover 显示),你可能需要预加载它们: $.preloadImages = function () { for (var i = ...15.鼠标悬停(hover)切换 class 属性 假如当用户鼠标悬停在一个可点击的元素上时,你希望改变其效果,下面这段代码可以在其悬停在元素上时添加 class 属性,当用户鼠标离开时,则自动取消该...,并把要移除的属性作为参数传入: $('input[type="submit"]').removeAttr('disabled'); 17.阻止链接加载 有时你不希望链接到某个页面或者重新加载它...').find('.content').hide(); // Accordion $('#accordion').find('.accordion-header').click(function ()
jQuery.fn.panel.defaults可以给组件添加默认的配置项 常用属性: title string 在面板头部显示的标题文本。...collapsed boolean 定义是否在初始化的时候折叠面板。 closed boolean 定义是否在初始化的时候关闭面板。...href:从远程加载内容 cache boolean 如果为true,在超链接载入时缓存面板内容。 loadingMessage string 在加载远程数据的时候在面板内显示一条消息。 <!...fn大多都是以on开头的,大部分复杂组件,都可以在初始化时,使用onxxx属性配置,值为事件响应 onCollapse 折叠是触发 onExpand 展开时触发 小部分简单组件,还是使用JQuery...按钮的宽度可以动态和折叠/展开以适应它的文本标签。 常用的属性: plain boolean 为true时显示简洁效果。
Bootstrap4 折叠 Bootstrap4 折叠可以很容易的实现内容的显示与隐藏。... 默认情况下折叠的内容是隐藏的,你可以添加 .show 类让内容默认显示: 实例 Lorem ipsum dolor...注意: 使用 data-parent 属性来确保所有的折叠元素在指定的父元素下,这样就能实现在一个折叠选项显示时其他选项就隐藏。...实例 选项二 <div id="collapseTwo" class="collapse" data-parent="#<em>accordion</em>
treePidName: 'parentId', // pid字段的名称 treeDefaultClose: true, //是否默认折叠...最上级的父级id treeIdName string 否 id字段的名称 treePidName string 否 pid字段的名称 treeDefaultClose boolean 否 是否默认折叠...treeLinkage boolean 否 父级展开时是否自动展开所有子级 treeColIndex 树形图标(箭头和文件夹、文件的图标)显示在第几列, 索引值是cols数组的下标。...7,我遇到的坑 我照着他给的教程一步步弄下来页面也显示出来了,但就是不能折叠,不管是我用折叠方法还是点那个三角图片还是设置为默认折叠,就是不管用, 不能折叠,可把我给气坏了。...最后,分享一下我写的不成熟的这个页面的功能汇总,做个记录: 主要功能有,树形表格展示,添加,修改,删除,批量删除,搜索,layui时间日期自定义格式列,表格全部展开、折叠、刷新表格等功能,有兴趣的看下吧
建议使用压缩版的 JavaScript 文件bootstrap.js 和 bootstrap.min.js 都包含了所有插件,你在使用时,只需选择一个引入页面就可以了。...如果你是单个引入每个插件的,请确保在文档中检查插件之间的依赖关系。注意,所有插件都依赖 jQuery (也就是说,jQuery必须在所有插件之前引入页面)。...如果你是单个引入每个插件的,请确保在文档中检查插件之间的依赖关系。注意,所有插件都依赖 jQuery (也就是说,jQuery必须在所有插件之前引入页面)。...如果你是单个引入每个插件的,请确保在文档中检查插件之间的依赖关系。注意,所有插件都依赖 jQuery (也就是说,jQuery必须在所有插件之前引入页面)。...slide 给图片添加运动的效果 data-interval="500" 间隔时间,单位为毫秒,1秒是等于1000毫秒的,不要低于400,否则容易出现问题 data-ride="carousel" 页面一加载后就开始播放
引入必要的JS与CSS文件 //引入 jQuery 核心库,这里采用的是 2.0 <script type="text/javascript" src="easyui/<em>jquery</em>.min.js...选项卡使用的class是: easyui-<em>accordion</em> <em>在</em>easyui-tabs元素中添加一个div就是一个子选项卡 子选项卡可以通过title属性来指定标题, data-options添加关闭按钮...title: 窗口标题, 类型为string 重写了一些data-options属性 : collapsible: 是否可<em>折叠</em> , 类型boolean <em>默认</em>true minimizable: 是否显示最小化按钮...选择的日期发生改变<em>时</em> onChange:函数名 编写函数<em>时</em>, 存在两个形式参数: 参数1. 选择的新日期 参数2. 之前的旧日期 2....选择日期<em>时</em> onSelect:函数名 编写函数<em>时</em>, 存在一个形式参数: 参数1.
领取专属 10元无门槛券
手把手带您无忧上云